@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Zain:ital,wght@0,400;0,700;0,800;1,400&family=Zen+Maru+Gothic:wght@400;500;700&display=swap');
/* --HTML-- */
html {
	overflow-y:scroll;
	height:100%;
	-webkit-overflow-scrolling: touch;
}
html.wf-active {
  visibility: visible;
}

/* --BODY-- */
body {
	margin:0;
	padding:0;
	height:100%;
}

/* --OTHER TAGS-- */
a img, img { border:0; }
a {}

blockquote, dd, div, dl, dt, h1, h2, h3, h4, h5, h6, li, ol, ul, pre, span, table, caption, p {
	margin:0;
	padding:0;
}

h1,h2,h3,h4,h5,h6 {
	font-weight: normal;	
}
abbr, acronym {
	border:0;
}

address, cite, code, dfn, em, th, var {
	font-style:normal;
	font-weight:normal;
}

code, kbd, pre, samp, tt {
	font-family:monospace;
	line-height:100%;
}

	/* for IE7 */
	*+html code, kbd, pre, samp, tt {
	font-size:108%; 
	}

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

/* --A-- */
a {
	cursor:pointer;
	text-decoration:underline;
}

a:hover,a:focus { text-decoration:none; }

/*figure*/
figure { margin: 0; padding: 0;}

/* --IMG-- */
img { vertical-align: bottom; }
img.width100 { width:100% !important; height:auto !important; }

/* --FORM-- */
button, fieldset, form, input, label, legend, select, textarea {
	font-family:inherit;
	font-size:100%;
	font-style:inherit;
	font-weight:inherit;
	margin:0;
	padding:0;
	vertical-align:baseline;
}
fieldset {
	border:1px solid #ccc;
	margin-bottom:1em;
	padding:0 1em 1em 1em;
}

legend {
	background:#fff;
	padding:0.3em;
}

input, textarea {
	padding:0;
	margin: 0;
	vertical-align:middle;
}

input[type="checkbox"],input[type="radio"] { vertical-align:-2px !important; margin-right:5px; }
*input[type="checkbox"],*input[type="radio"] { vertical-align:2px !important; }

input[type="submit"],input[type="button"] { padding:0em; margin: 0; cursor: pointer;}

select { padding:0.3em; }


input,textarea {
	border:1px solid #888;
	padding:0.5em !important;
	border-radius:3px;
}
form .btnarea {
	text-align:center;
}
span.red {
	color:#ff0000;
}
form span.red {
	color:#ff0000;
}

/* --LIST-- */
ol, ul {
	text-align:justify;
	text-justify:inter-ideograph;
}
li {
	list-style-type: none;	
}

/* --TABLE-- */
table {
	border-collapse:collapse;
	border-spacing:0;
	font-size:100%;
}
th,td{vertical-align:top;}
section table {
	width:100%;
}

/* --HR-- */
hr { display: none; clear:both; } /* 不可視使用 */

/* -------------------------------------------
PC/SP 共通
------------------------------------------- */
img {
	max-width:100%;
	height:auto;
}
article img.aligncenter {
    display: block;
    margin: 0 auto;
}
article .alignright { float: right; margin-left:1em; }
article .alignleft { float: left; margin-right:1em; }

/* .article */
#main article{
}

/* P */
article p { margin-bottom:1.4em; }

/* -------------------------------------------
Module
------------------------------------------- */
/* font_position */
.left { text-align: left !important; }
.center { text-align: center !important; }
.right { text-align: right !important; }

/* font_style */
.normal { font-weight: normal !important; }
.bold { font-weight: bold !important; }
.big { font-size: 120% !important; }
.small { font-size: 80% !important; }

/* float position */
.leftF { float: left !important; }
.rightF { float: right !important; }
.clear { clear: both !important; }

/* ※ */
em,sup{color:#37a061;}
sup{margin-left:3px;}


/* -------------------------------------------
Layout
------------------------------------------- */
body {
	font-size: 16px;
	line-height: 1.8;
	text-align: justify;
    font-family: "Zen Maru Gothic", sans-serif;
    font-weight: 400;
    font-style: normal;
	height: 100%;
	width: 100%;
    color: #332728;
}
section { position: relative;}
section.FullWidth { width: 100%; margin: 0; padding: 0;}

/* -------------------------------------------
Elements
------------------------------------------- */
a {color:#444444; text-decoration:none; transition: all 0.3s ease-out;}
a:hover {color:#2ca6e0; text-decoration:none;}
a img {transition: opacity 0.3s ease-out;}
a:hover img {
	opacity:0.75 ;
}
input[type="submit"],input[type="button"] { transition: opacity 0.3s ease-out; }
input[type="submit"]:hover,
input[type="button"]:hover {
	filter:alpha(opacity=75); /*IE*/
	-moz-opacity:0.75; /*FF*/
	opacity:0.75 ;
}
i {margin-right: 0.5em; font-size: 1.25em;}
p { margin-bottom: 1.5em; }
section p:nth-last-of-type(1) { margin-bottom: 0; }

/* -------------------------------------------
SiteHeader
------------------------------------------- */
header#siteheader {
    font-family: "Zain", sans-serif;
    font-weight: 800;
    font-style: normal;
    z-index: 1000;
}
header#siteheader .inner {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    background: #FFF;
    align-items: center;
    justify-content: flex-end;
}
header#siteheader h1 {
    position: absolute;
    bottom: 0;
    left: 16px;
}
header#siteheader h1 img {
    height: 64px;
    width: auto;
}

/* -------------------------------------------
Navigation
------------------------------------------- */
nav#MainNav {
    width: 100%;
    padding: 16px 0;
}
nav#MainNav ul {
    box-sizing: border-box;
    display: flex;
    justify-content: space-between;
    font-size: 1.25rem;
    letter-spacing: 0.075em;
    line-height: 1;
    padding-left: 80px;
}

/* -------------------------------------------
MainColumn
------------------------------------------- */
main {
    display: block;
    width: 100%;
    overflow-x: hidden;
}

/* -------------------------------------------
Footer
------------------------------------------- */
footer#sitefooter {
    position: sticky;
    top: 100vh;
    width: 100%;
    box-sizing: border-box;
    background: #ab8387;
    color: #FFFFFF;
    padding-bottom: 80px;
}
footer#sitefooter .inner {
    position: relative;
    width: 85%;
    max-width: 1080px;
    margin: auto;
    display: flex;
    flex-wrap: wrap;
    box-sizing: border-box;
    justify-content: center;
}
footer#sitefooter dl {
    display: flex;
    flex-wrap: wrap;
}
footer#sitefooter p {
    margin-bottom: 0;
}
footer#sitefooter p.CopyRight {
    text-align: center;
}

/* -------------------------------------------
Pagetop
------------------------------------------- */
/* トップに戻るボタン */
#page-top {
	position: fixed;
	bottom: 1%;
	right: 1%;
	font-size: 100%;
	z-index: 100000;
	line-height: 1;
	width: 3em;
	padding: 1em 1em 0;
}
#page-top a {
	border-top: solid 1px #4e3b3c;
	text-decoration: none;
	color: #4e3b3c;
	text-align: center;
	display: block;
}
#page-top a:hover {
	text-decoration: none;
}

/* -------------------------------------------
Pages
------------------------------------------- */

/* -------------------------------------------
MediaQuery
------------------------------------------- */
/*SmartPhone*/
@media screen and (max-width:767px) {
	body {font-size: 16px;}
    main {
        padding-top: 96px;
        padding-bottom: 192px;
    }
    section {
        box-sizing: border-box;
    }
    section h1 {
    }
    article {
        box-sizing: border-box;
    }
	.pc_img { display:none; }
	.sp_img { display:block; }
    /* -------------------------------------------
    SiteHeader
    ------------------------------------------- */
    header#siteheader {
        position: fixed;
        bottom: 0;
        width: 100%;
    }
    header#siteheader .inner {
        padding: 0 16px;
        transition: ease-out .3s;
    }
    header#siteheader .inner.scroll {
        box-shadow: 0 0 10px rgba(0,0,0,.25);
    }
    header#siteheader h1 {

    }
    /* -------------------------------------------
    Footer
    ------------------------------------------- */
    footer#sitefooter {
        padding-bottom: 80px;
    }
    footer#sitefooter .inner {
        transform: translateY(-48px);
        flex-direction: column;
        justify-content: center;
    }
    footer#sitefooter p.Logo {
        width: 116px;
        margin: auto;
    }
    footer#sitefooter .inner .ShopInfo {
        box-sizing: border-box;
        width: 15em;
        margin: auto;
        padding: 32px 0 48px;
    }
    footer#sitefooter figure.Insta {
        box-sizing: border-box;
        width: 96px;
        margin: auto;
    }
}

/*Tablet*/
@media screen and (min-width:768px) {
    /* -------------------------------------------
    SiteHeader
    ------------------------------------------- */
    header#siteheader {
        position: fixed;
        top: 32px;
        right: 0;
        width: auto;
    }
    header#siteheader .inner {
        padding: 0 16px;
        border-top-left-radius: 40px;
        border-bottom-left-radius: 40px;
        transition: ease-out .3s;
    }
    header#siteheader .inner.scroll {
         box-shadow: 0 0 10px rgba(0,0,0,.25);
    }
    /* -------------------------------------------
    Navigation
    ------------------------------------------- */
    nav#MainNav ul {
        padding-left: 80px;
        padding-right: 1em;
    }
    nav#MainNav ul li {
        margin-left: 1em;
    }
}

@media screen and (min-width:768px) and (max-width:1024px) {
	body {font-size: 16px;}
    main {
        padding-top: 96px;
        padding-bottom: 96px;
    }
    /* -------------------------------------------
    Footer
    ------------------------------------------- */
    footer#sitefooter {
        padding-bottom: 48px;
    }
    footer#sitefooter .inner {
        flex-direction: row;
        justify-content:space-between;
        padding-top: 48px;
    }
    footer#sitefooter p.Logo {
        width: 192px;
        transform: translateY(-16px);
    }
    footer#sitefooter .inner .ShopInfo {
        box-sizing: border-box;
        width: 15em;
    }
    footer#sitefooter figure.Insta {
        box-sizing: border-box;
    }
}

@media screen and (max-width:1024px) {
    #MainNav .pc_elm { display: none; }
    #MainNav .sp_elm { display: block; }
}

/*Desktop*/
@media screen and (min-width:1025px) {
    #MainNav .pc_elm { display: block; }
    #MainNav .sp_elm { display: none; }
    main {
        padding-top: 128px;
        padding-bottom: 180px;
    }
    /* -------------------------------------------
    Footer
    ------------------------------------------- */
    footer#sitefooter {
        padding-bottom: 48px;
    }
    footer#sitefooter .inner {
        flex-direction: row;
        justify-content:space-between;
        padding-top: 36px;
    }
    footer#sitefooter p.Logo {
        width: 220px;
        margin-top: -112px;
    }
    footer#sitefooter .inner .ShopInfo {
        box-sizing: border-box;
        margin-bottom: 48px;
    }footer#sitefooter .inner .ShopInfo dd {
        margin-right: 1.25em;
    }
    footer#sitefooter figure.Insta {
        box-sizing: border-box;
        width: 82px;
    }
    
    
    
    
    
    
}