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

a{
	outline: none;
}
a:focus{
	outline: none;
}

.flex-container {
  display: none;
  padding: 0;
  background-color: #ffffff;
  color:#000000;
}
.content-visible .flex-container {
  display: block;
}

.flex-container h1 {
  text-align:center;
  font-size:2.0em;
  width:100%;
  font-family:'Special Elite';
  padding:2.0em 0;
}

.flex-container .parfum01 {
  padding-bottom:0.5em;
}

.flex-container h2 {
  text-align:center;
  font-size:1.6em;
  width:100%;
  font-family: 'Special Elite';
  margin-bottom:0.7em;
}

.flex-container01 {
  display: none;
  padding:0;
}
.content-visible .flex-container01 {
  display: block;
}

/* logo */

.headroom {
  position:fixed;
  top: 1%;
  left: 1%;
  padding:22px 7px 3px 7px;
  cursor:pointer;
}



/* Parfume */

.boxA {
  display: -webkit-flex; /* Safari */
  display: flex;
  -webkit-justify-content: center; /* Safari用 */
  justify-content: center;
  padding:0 0 4.2em 0;
 }
 
@media screen and (max-width: 1023px) {
.boxA {
  -webkit-flex-direction: column; /* Safari用 */
  flex-direction: column;
  margin:0;
}
}

.boxA .left {
  margin-right:3%;
}

@media screen and (max-width: 1023px) {
.boxA .left {
	width:100%;
	margin:0;
}
}

.boxA .right {
  margin-left:3%;
  font-family:"PT Sans";
}

@media screen and (max-width: 1023px) {
.boxA .right {
	width:100%;
	margin:0;
}
}

.boxA .left .photo01 {
}

.boxA .left .photo02{
	text-align:center;
}

.boxA .left .photo02 img {
	border-radius:6px;
}

@media screen and (max-width: 1023px) {
.boxA .left .photo01 {
    text-align:center;
}
.boxA .left .photo01 img {
	width:100%;
	max-width:450px;
}

.boxA .left .photo02{
	text-align:center;
}

.boxA .left .photo02 img {
	width:100%;
	max-width:450px;
	padding:0 0.2em;
}
}

.boxA .itemL {
  text-align:center;
  padding: 1.9em 0 1.9em 0;
}

@media screen and (min-width: 1024px) {
.boxA .itemL {
	display:none;
}
}

.boxA .itemR {
  text-align:center;
  padding: 4.1em 0 1.9em 0;
}

@media screen and (max-width: 1023px) {
.boxA .itemR {
	display:none;
}
}

.boxA .bc {
  font-size: 1.7rem;
  padding:2.8em 0.8em 1.3em 0.8em;
  width:100%;
  max-width:800px;
  line-height:1.6em;
  margin:0 auto;
}

.boxA .bc01 {
  font-size: 1.7rem;
  padding:2.8em 0.8em 1.3em 0.8em;
  width:100%;
  max-width:800px;
  line-height:1.6em;
  margin:0 auto;
}

.boxA .bcna {
  font-size: 1.7rem;
  padding:1.3em 0.8em 0em 0.8em;
  width:100%;
  max-width:800px;
  line-height:1.6em;
  margin:0 auto;
  text-align:center;
}

@media screen and (min-width: 1024px) {
.boxA .bc {
  font-size: 1.8rem;
  width:450px;
  padding:0em 0 1.4em 0;
  line-height:1.7em;
}

.boxA .bc01 {
  font-size: 1.7rem;
  width:450px;
  padding:1.0em 0 1.0em 0;
  line-height:1.9em;
}

.boxA .bcna {
  font-size: 1.7rem;
  width:450px;
  padding:1.5em 0 1.0em 0;
  line-height:1.9em;
  text-align:center;
}
}




.right .about{
  width:100%;
  max-width:800px;
  margin:0 auto;
  padding-bottom:6.5em;
}


.right .about dt{
  width:24%;
  display:block;
  float:left;
  background:#000000;
  color:#FFFFFF;
  margin-right:4%;
  margin-bottom:4%;
  margin-left:1.5%;
  text-align:center;
  border-radius:3px;
  line-height:1.6em;
  font-family:"Times New Roman";
}

.right .about .eau{
  background:#7d7d7d;
}

.right .about dd{
  width:69%;
  display:block;
  float:left;
  margin-bottom:4%;
  line-height:1.6em;
}

@media screen and (min-width: 1024px) {

.right .about{
  display:block;
  float:left;
  width:450px;
  clear:both;
  padding:0;
}

.right .about dt {
  width:20%;
  display:block;
  float:left;
  background:#000000;
  color:#FFFFFF;
  margin-right:4%;
  margin-bottom:2.5%;
  margin-left:1.5%;
  text-align:center;
  border-radius:3px;
  line-height:1.6em;
}

.right .about .eau{
  background:#7d7d7d;
}

.right .about dd {
  width:73%;
  display:block;
  float:left;
  margin-bottom:2.5%;
  line-height:1.6em;
}
}



.right .about h3 {
	text-align:center;
	font-size:1.5em;
	border-bottom:#000000 solid 1px;
	padding:2.5em 0 0.4em 0;
	margin-bottom:1.0em;
	font-family:"PT Sans";
}

.right .about .detail01 {
	padding:2.5em 0 0.4em 0;
}

@media screen and (max-width: 1023px) {
.right .about .detail01 {
	padding:5.7em 0 0.4em 0;
}
}
.right .about .sm {
	font-size:0.7em;
}


/* NEWS COLUMN-Tab */

.tab{
   overflow:hidden;
   display: -webkit-flex; /* Safari用 */
   display: flex;
   -webkit-justify-content: center; /* Safari用 */
   justify-content: center;
   -webkit-align-items: center; /* Safari用 */
   align-items: center;
   -webkit-flex-wrap: wrap; /* Safari用 */
   flex-wrap:wrap;
   padding:0;
   margin-top:-10px;
   font-family:"Times New Roman";
}

.tab p{
   background:#ccc;
   padding:15px 0px;
   margin:0 0.5%;
   margin-bottom:6px;
   cursor:pointer;
   width:49%;
   text-align:center;
   border-radius:4px;
   font-size:1.2em
}

@media screen and (min-width: 800px) {

.tab p{
   background:#ccc;
   padding:8px 0px;
   cursor:pointer;
   text-align:center;
   border-radius:4px;
   max-width:395px;
}
}

#news{
   margin-right:0px;
}

@media screen and (min-width: 800px) {
#news{
   margin-right:17px;
}
}

.tab p:hover{
   background:#666666;
   color:#FFFFFF;
}

.tab p.select{
   background:#000000;
   color:#FFFFFF;
}

.content div{
   line-height:1.6em;
   font-size:1.0em;
   max-width:800px;
   margin:0 auto;
   padding:0 0 1.6em 0;
}

.content p{
   line-height:1.6em;
   margin:1.0em 1.5em 2.6em 1.5em;
   font-family:"PT Sans";
}

.content h1{
   font-size:1.4em;
   color:#FFFFFF;
   display: -webkit-flex; /* Safari用 */
   display: flex;
   -webkit-justify-content: center; /* Safari用 */
   justify-content: center;
   -webkit-align-items: center; /* Safari用 */
   align-items: center;
   height:450px;
   border-radius:4px;
   line-height:100%;
}

.content h2{
   text-align:center;
   font-size:1.1em;
   margin-top:2.0em;
   margin-bottom:0;
   padding:0;
   font-family:'Libre Baskerville';
}

.content .news01{
   text-align:center;
   font-size:1.1em;
   line-height:1.0em;
   margin-bottom:0;
   margin-top:2.8em;
}

.content .news02{
   text-align:center;
   font-size:1.2em;
   line-height:1.0em;
   margin-top:0.7em;
   margin-bottom:1.5em;
}

.content h3{
   font-size:0.9em;
   color:#fff;
   background-color:#000;
   text-align:center;
   margin-top:2.0em;
   padding:0.7em 0;
   border-radius:4px 4px 0 0;
   font-family:"Times New Roman";
}

.content h4{
   text-align:center;
   font-size:0.9em;
   margin-top:0em;
   margin-bottom:1.9em;
   padding:0;
   font-family:'Libre Baskerville';
   line-height:100%;
}

@media screen and (min-width: 800px) {
.content h3{
   font-size:1.1em;
}
.content h4{
   text-align:center;
   font-size:0.9em;
   margin-top:0em;
   margin-bottom:1.9em;
   padding:0;
   font-family:'Libre Baskerville';
   line-height:100%;
}
}

.content .brown{
   background-color:#C5B787;
}
.content .pink{
   background-color:#CC6666;
}
.content .green{
   background-color:#1C3700;
}
.content .yerrow{
   background-color:#D9D900;
}

.content h5 img{
   width:100%;
   border-radius:0 0 4px 4px;
}

.content .col55{
   width:100%;
   border-radius:0;
   padding-top:1.5em;
   line-height:100%;
}

.content h4 img{
   width:100%;
   border-radius:5px;
}

.content dl{
   display: -webkit-flex; /* Safari用 */
   display: flex;
   padding:0 0 1.0em 0;
   max-width:800px;
   width:100%;
}

.content dl img{
   border-radius:4px;
}

.content dt{
   margin-right:8px;
}

.content .newsT01{
   width:24.6%;
}

.content .newsT01 img{
   width:100%;
}

.content dd{
}

.content .newsT02{
   width:75.4%;
}

.content dt p{
  background:#EFEFEF;
  margin:0;
  padding:0.6em 1.0em;
  font-size:0.9em;
  border-radius:4px;
}

.content dd p{
  background:#EFEFEF;
  margin:0;
  padding:0.6em 1.0em;
  font-size:0.9em;
  border-radius:4px;
}

.content .newsT03{
  background:#fff;
  padding:0.6em 0 0.6em 1.4em;
  font-size:1.0em;
}

@media screen and (max-width: 799px) {

.content dl{
   display: block;
   margin:0 auto;
   max-width:500px;
   padding-bottom:0;
   width:100%;
}

.content dl img{
   border-radius:4px;
}

.content dt{
   margin:0em 0.2em 2.0em 0.2em;
}

.content dd{
   margin:0em 0.2em 2.0em 0.2em;
}

.content dt img{
   width:100%;
}

.content dd img{
   width:100%;
}

.content .newsT01{
   width:100%;
   margin:0;
   padding:0em 0.2em 2.0em 0.2em;
}

.content .newsT01 img{
   width:100%;
   margin:0;
   padding:0;
}

.content .newsT02{
   width:100%;
   margin:0;
   padding:0em 0.8em 1.6em 0.8em;
}

.content .newsT03{
  background:#fff;
   margin:0;
   padding:0;
}

}



.content .textR {
   text-align:center;
   margin:0;
   padding-bottom:15px;
}

.hide {
   display:none;
}


/* Shop */

.boxC {
  display: -webkit-flex; /* Safari用 */
  display: flex;
  -webkit-justify-content: center; /* Safari用 */
  justify-content: center;
  padding:0em 0 3.0em 0;
  word-break:break-all;
 }
 
.boxC .left01{
  margin-right:0px;
  width:30%;
  max-width:300px;
  position: relative;
}

.boxC .left01 p{
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%); /* Safari用 */
  transform: translate(-50%, -50%);
}

.boxC .right01 {
  width:100%;
  display:block;
  float:left;
  max-width:800px;
}

.boxC .right01 h1{
  text-align:center;
  margin-bottom:1.0em;
  padding:0 0 0.1em 0;
}

.boxC .right01 dt{
  width:16%;
  display:block;
  float:left;
  background:#000000;
  color:#FFFFFF;
  margin-right:4%;
  margin-bottom:2.5%;
  margin-left:1.5%;
  text-align:center;
  border-radius:3px;
  line-height:1.6em;
  font-family:"Times New Roman";
}

.boxC .right01 .maT01{
  width:16%;
  display:block;
  float:left;
  background:#000000;
  color:#FFFFFF;
  margin-right:4%;
  margin-bottom:2.5%;
  margin-left:1.5%;
  margin-top:9%;
  text-align:center;
  border-radius:3px;
  line-height:1.6em;
}

.boxC .right01 dd{
  width:77%;
  display:block;
  float:left;
  margin-bottom:2.5%;
  line-height:1.6em;
  font-family:"PT Sans";
}

.boxC .right01 .maT02{
  width:77%;
  display:block;
  float:left;
  margin-bottom:2.5%;
  margin-top:9%;
  line-height:1.6em;
}

@media screen and (max-width: 799px) {
.boxC .right01 dt{
  width:31%;
  display:block;
  float:left;
  background:#000000;
  color:#FFFFFF;
  margin-right:4%;
  margin-bottom:4%;
  margin-left:1.5%;
  text-align:center;
  border-radius:3px;
  line-height:1.6em;
}

.boxC .right01 .maT01{
  width:31%;
  display:block;
  float:left;
  background:#000000;
  color:#FFFFFF;
  margin-right:4%;
  margin-bottom:4%;
  margin-left:1.5%;
  margin-top:24%;
  text-align:center;
  border-radius:3px;
  line-height:1.6em;
}

.boxC .right01 dd{
  width:58%;
  display:block;
  float:left;
  margin-bottom:4%;
  line-height:1.6em;
}

.boxC .right01 .maT02{
  width:58%;
  display:block;
  float:left;
  margin-bottom:4%;
  line-height:1.6em;
  margin-right:3%;
  margin-top:24%;
}
}


/* about us */
.boxD {
   max-width:800px;
   margin:0 auto;
}

.boxD dl{
   display: -webkit-flex; /* Safari用 */
   display: flex;
   padding:0 0 4.0em 0;
   max-width:800px;
   width:100%;
   font-family:"PT Sans";
}

.boxD dt{
   margin-right:30px;
   width:50%;
}

.boxD dt img{
   width:100%;
   border-radius:4px;
}

.boxD dd{
   width:50%;
   font-family:"PT Sans";
}

.boxD dt p{
  background:#efefef;
  color:#000;
  margin:0.3em 0 0 0;
  padding:0.3em 0.3em;
  font-size:1.2em;
  border-radius:4px;
  text-align:center;
  font-family:"Times New Roman";
  line-height:1.5em;
}

.boxD dt .au{
  background:none;
  margin:0;
  padding:1em 0 0 0;
}

.boxD dd p{
  margin:0;
  padding:0.6em 1.0em;
  font-size:1em;
  line-height:1.6em;
}

@media screen and (max-width: 799px) {

.boxD dl{
   display: block;
   margin:0 auto;
   max-width:500px;
   width:100%;
   padding:0;
}

.boxD dt{
   padding:0em 0.2em 0em 0.2em;
   width:100%;
}

.boxD dd{
   padding:1.6em 0.2em 2.0em 0.2em;
   width:100%;
}

.boxD dt img{
   width:100%;
}

.boxD dd img{
   width:100%;
}

}


/* footer */

.CP01 {
  display: -webkit-flex; /* Safari */
  display: flex;
  width:100%;
  line-height:100%;
  max-width:400px;
  margin:0 auto;
}

.CP01 p {
  font-family:Georgia, serif;
  font-size: 3.5rem;
  text-align:center;
  padding-bottom:1.1em;
}

.CP01 .c01 {
  width:33%;
  text-align:right;
}

.CP01 .c02 {
  width:34%;
}

.CP01 .c03 {
  width:33%;
  text-align:left;
}

.CP01 a{
  color:#000;
}

.CP01 a:hover{
  opacity: 0.8;
}


.CP {
  display: -webkit-flex; /* Safari */
  display: flex;
  width:100%;
  background:#FFF;
  line-height:100%
}

.CP p {
  text-align:center;
  font-family:Georgia, serif;
  font-size: 1.8rem;
}
@media screen and (max-width: 799px) {
.CP p {
  font-size: 1.7rem;
}
}
.CP .c01 {
  width:50%;
  background:url(../img/wagara03.png) repeat;
  margin-right:0.2%;
  border-radius:0 40px 0 0;
}

.CP .p01 {
  width:50%;
  background:url(../img/wagara03.png) repeat;
  border-radius:40px 0 0 0;
}

.CP .c01 a{
  color:#000;
  height:54px; 
  display:block;
  padding-top:20px;
}

.CP .p01 a{
  color:#000;
  height:54px; 
  display:block;
  padding-top:20px;
}

.CP .c01 a:hover{
  opacity: 0.8;
}

.CP .p01 a:hover{
  opacity: 0.8;
}


.fcF {
  display: none;
  background:url(../img/bg01.png) repeat;
  color:#ffffff;
}

.content-visible .fcF {
  display: -webkit-flex; /* Safari */
  display: flex;
  height: 400px;
  -webkit-flex-flow: column; /* Safari用 */
  flex-flow: column;
  -webkit-justify-content: space-between; /* Safari用 */
  justify-content: space-between;
}

.fcF p {
  text-align:center;
  font-family:"Times New Roman";
  font-size: 1.3rem;
  line-height: 1.8;
}

.fcF .logo{
  text-align:center;
  padding: 2.7em 0 0 0;
}

.fcF .foot{
  text-align:center;
  font-family:"Times New Roman";
  padding: 0 0 1px 0;
  font-size: 1.4rem;
  opacity: 0.7;
}

/* PAGETOP */

#pagetop{
    position:fixed;
    right:20px;
    bottom:0px;
    cursor:pointer;
}

#pagelogo{
    position:fixed;
    top:20px;
    left:50%;
    cursor:pointer;
}


/* SCROOL */

#scro01{
    position: absolute;
	bottom: 94px;
	left: 50%;
	z-index: 5;
	display: inline-block;
	-webkit-transform: translate(0, -50%);
	transform: translate(0, -50%);
	text-decoration: none;
}


#scro01 .scro{
	position: absolute;
	top: 0;
	left: 50%;
	width: 24px;
	height: 42px;
	margin-left: -12px;
	border: 2px solid #dfdfdf;
	border-radius: 50px;
	box-sizing: border-box;
	opacity: 0.8;
}
#scro01 p{
	position: absolute;
	top: 48px;
	left: 50%;
	margin-left: -18px;
	box-sizing: border-box;
	color:#fff;
	font-family:"Times New Roman";
}
#scro01 .scro::before {
	position: absolute;
	top: 4px;
	left: 50%;
	content: '';
	width: 6px;
	height: 6px;
	margin-left: -3px;
	background-color: #dfdfdf;
	border-radius: 100%;
	-webkit-animation: sdb 3.1s infinite;
	animation: sdb 3.1s infinite;
	-webkit-animation-iteration-count: 3;
    -moz-animation-iteration-count: 3;
    animation-iteration-count: 3;
	box-sizing: border-box;
}
@-webkit-keyframes sdb {
	0% {
		-webkit-transform: translate(0, 0);
		opacity: 0;
	}
	40% {
		opacity: 1;
	}
	80% {
		-webkit-transform: translate(0, 12px);
		opacity: 0;
	}
	100% {
		opacity: 0;
	}
}
@keyframes sdb {
	0% {
		transform: translate(0, 0);
		opacity: 0;
	}
	40% {
		opacity: 1;
	}
	80% {
		transform: translate(0, 12px);
		opacity: 0;
	}
	100% {
		opacity: 0;
	}
}

/* 170719 */

.boxK{
   line-height:1.6em;
   max-width:800px;
   margin:0 auto;
   padding:0 0 1.6em 0;
   font-family:"PT Sans";
}

.boxK .copy05{
   padding:0em 6.8em 2.5em 6.8em;
   font-size:1em;
}

@media screen and (max-width: 600px) {
.boxK .copy05{
   padding:0em 1.8em 1.5em 1.8em;
}
}