@import url('//fonts.googleapis.com/css?family=Roboto:300,400,500,700,900');

@charset "UTF-8";

/* CSS Document */
body {
  padding-top: 0 !important;
}

/*-----------------------------movie_css*/

#topMv {
  overflow: hidden;
  /* height: 100vh;*/
  position: relative;
}

.slider .slick-track {
  max-height: 624px;
}

.slick-slide img {
  width: 100%;
  height: auto;
}

.slick-dots {
  bottom: 10px !important;
}

.slick-dotted.slick-slider {
  margin-bottom: 0px !important;
}

.slider li {
  background-size: cover !important;
  background: no-repeat;
  background-position: 0% 0%;
}

.scroll {
  bottom: 7%;
  left: 50%;
  margin-left: -30px;
  position: absolute;
  z-index: 99;
  background: #fff;
  color: #fe65b7;
  font-size: 12px;
  display: inline-block;
  text-decoration: none;
  border-radius: 100%;
  width: 60px;
  height: 60px;
  border: solid 2px #f03f90;
}

.scroll p {
  margin: 34% 14%;
}

.sctext {
  color: #f03f90;
}

.sctext span {
  position: absolute;
  left: 33%;
  font-size: 22px;
  margin-top: 20%;
}


.mvTxt {
  width: 100%;
  position: absolute;
  top: 35%;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  z-index: 9999;
  text-align: center;
}

.mvTxt span {
  display: block;
  color: #fff;
  text-align: center;
  letter-spacing: 0.1em;
  text-shadow: 0px 0px 8px #555;
}

.mvTxt span.en {
  font-family: 'Roboto', sans-serif;
  font-weight: 500;
  font-size: 70px;
  letter-spacing: 0.05em;
  margin-bottom: 15px;
}

.mvTxt span.en img {
  max-width: 100%;
}

.mvTxt span.ja {
  /*font-family: 'notoserif',serif;*/
  font-weight: 300;
  font-size: 28px;
}

.mvTxt02 {
  width: 100%;
  position: absolute;
  top: 15%;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  z-index: 9999;
  text-align: center;
}

.mvTxt03 {
  width: 100%;
  position: absolute;
  top: 25%;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  z-index: 9999;
  text-align: center;
}

/*-----------------------------movie_css*/



/* Coupon are */
#coupon {
  background: #f03f90;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  padding: 0;
 /* width: 1024px;
  margin: 0 auto;
  margin-top: 60px;*/
}

#coupon div {
  /* display: inline-block; */
  /* margin-right: 0px; */
  float: left;
}

.couponbox a img {
  width: 100%;
}

@media only screen and (max-width: 800px) {
  #coupon {width: 100%; margin-top: 0px;}
  .w30 {
    width: 50% !important;
  }
}

#contents {
  background: #fff;
  margin: 0 auto;
}



/* section 01 - collection */
.bg_coll {
  background: #fff;
}


#vrl {
  margin-top: 30px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

#vrl p {
  text-align: center;
  overflow: visible;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  color: #eb6100;
  height: 200px;
}

#vrl span {
  text-align: left;
  -ms-writing-mode: tb-rl;
  -webkit-writing-mode: vertical-rl;
  writing-mode: vertical-rl;
  display: inline-block;
  vertical-align: top;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

#vrl span.eng {
  font-size: 16px;
  letter-spacing: 0.1em;
}

#vrl span.jp {
  font-size: 18px;
  font-weight: bold;
  letter-spacing: 0.1em;
}

#collection .clm3 {}

#collection .clm3 li {
  float: left;
  margin-bottom: 20px;
  margin-right: 1.3%;
  width: 32.4%;
  overflow: hidden;
}

#collection .clm3 li a:hover {
  opacity: 0.75;

}

.lbox {
  float: left;
  width: 80%;
}

.lbox .ph img {
  width: 100%;
}

.rbox {
  float: right;
  width: 20%;
  height: 98.5%;
  position: relative;
}

.category {
  position: absolute;
  top: 0px;
  background: #f8f6f1;
  border-right: 3px solid #eb6100;
  height: 50%;
  width: 100%;
}

.catebg01 {
  background: url(/images/col_catebg01.jpg) repeat;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background-size: cover;
}

.catebg02 {
  background: url(/images/col_catebg02.jpg) repeat;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background-size: cover;
}

.catebg03 {
  background: url(/images/col_catebg03.jpg) repeat;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background-size: cover;
}

.catebg04 {
  background: url(/images/col_catebg04.jpg) repeat;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background-size: cover;
}

.catebg05 {
  background: url(/images/col_catebg05.jpg) repeat;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background-size: cover;
}

.catebg06 {
  background: url(/images/col_catebg06.jpg) repeat;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background-size: cover;
}

.catec02 {
  border-right: 3px solid #ea5a8f !important;
}

.catec03 {
  border-right: 3px solid #faca47 !important;
}

.catec04 {
  border-right: 3px solid #e90017 !important;
}

.catec05 {
  border-right: 3px solid #33c0ff !important;
}

.catec06 {
  border-right: 3px solid #086b35 !important;
}

.colt02 {
  color: #ea5a8f !important;
}

.colt03 {
  color: #faca47 !important;
}

.colt04 {
  color: #e90017 !important;
}

.colt05 {
  color: #33c0ff !important;
}

.colt06 {
  color: #086b35 !important;
}




/* section 02 - plan */
.bg_plan {
  background: url(/lib/cmn_img/stripe_pt.png) repeat;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 80px 0px 60px;
  background-color: #fffcd5;
}

#plan .clm3 li .ph {
  margin-top: 30px;
  text-align: center;
}

#plan .clm3 li .ph img {
  width: 100%;
}

#plan .cmnBtn_jp a {
  padding: 10px;
  width: 100%;
  display: inline-block;
  border: 2px solid #fe65b7;
  font-size: 16px;
  font-weight: bold;
  background: #fff;
  color: #fe65b7;
  border-bottom: solid 6px #ff51ae;
  position: relative;
  margin-top: 20px;
}

#plan .cmnBtn_jp a:hover {
  background: #fe65b7;
  text-decoration: none;
  color: #fff;
}

#plan .cmnBtn_jp_c02 a {
  border: 2px solid #faca47;
  color: #faca47;
  border-bottom: solid 6px #faca47;
}

#plan .cmnBtn_jp_c02 a:hover {
  background: #faca47;
}

#plan .cmnBtn_jp_c03 a {
  border: 2px solid #43c0f6;
  color: #43c0f6;
  border-bottom: solid 6px #43c0f6;
}

#plan .cmnBtn_jp_c03 a:hover {
  background: #43c0f6;
}

.cmnBtn_jp_c02 .arr {
  stroke: #faca47;
}

.cmnBtn_jp_c03 .arr {
  stroke: #43c0f6;
}

/* section 03 - special */
.bg_ss {
  background: url(/images/bg_ss.jpg) repeat;
  background-size: auto;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 80px 0px 60px;
}

.ssbox {
  background: #fff;
  border: 2px solid #fe65b7;
  position: relative;
  -webkit-box-shadow: 10px 10px 0px -1px rgba(254, 163, 212, 1);
  box-shadow: 10px 10px 0px -1px rgba(254, 163, 212, 1);
  padding: 50px 80px;
  text-align: center;
  margin-top: 180px;
}

.ssbox::before {
  content: "";
  position: absolute;
  left: 66%;
  top: -71px;
  background: url(/images/title_bg.png) no-repeat;
  background-size: 70%;
  width: 1260px;
  height: 346px;
  -webkit-transform: translateY(-50%) translateX(-50%);
  transform: translateY(-50%) translateX(-50%);
}

.ssbox h2 {
  position: absolute;
  top: 0%;
  left: 50%;
  -webkit-transform: translateY(-50%) translateX(-50%);
  transform: translateY(-50%) translateX(-50%);
}

.ssbox h2 img {
  width: 80%;
}


.wrapbox {
  margin-top: 90px;
}

.wrapbox ul li {
  margin-bottom: 20px;
}


.wrapbox ul li img {
  width: 100%;
}


.top_p1 {
  font-size: 22px;
  font-weight: bold;
  color: #41210f;
  margin: 30px 0px;
}

.top_p1 span {
  display: inline-block;
  position: relative;
  color: #484848;
  font-size: 2rem;
}

.top_p1 span:before,
.top_p1 span:after {
  width: 2px;
  height: 30px;
  content: "";
  position: absolute;
  top: 5px;
  background-color: #41210f;
}

.top_p1 span:before {
  left: -30px;
  -webkit-transform: rotate(-15deg);
  transform: rotate(-15deg);
}

.top_p1 span:after {
  right: -30px;
  -webkit-transform: rotate(15deg);
  transform: rotate(15deg);
}

.top_p2 {
  font-size: 15px;
  font-weight: bold;
  color: #fe65b7;
}

.videoBox {
    position: relative;
    width: 100%;
    margin: 30px auto 50px;
}
.videoBox iframe {
    width: 100%;
    height: 484px;
}

@media screen and (max-width: 800px){
 .videoBox {
    position: relative;
    width: 100%;
    padding: 70% 0 0 0;
    margin-bottom: 20px;
} 
.videoBox iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
}



/* section 04 - voice */
.bg_voice {}

.sliderzone .sliderzone_box a .txt-box {
  height: 180px;
}

#column .sliderzone .sliderzone_box a {
  height: 330px;
}

@media only screen and (max-width: 800px) {
  .sliderzone .sliderzone_box a .txt-box {
    height: 200px;
  }
}


/* section 05 - shop */
.bg_shop {
  background: url(/images/bg_shop.jpg) center center no-repeat;
  background-size: cover;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 80px 60px 60px;
}

/* section 06 - news */
.bg_news {
  background: #fff1f5;
}


/* section 07 - coulmn */
.bg_coulmn {}



/*  section 08 - other */
.bg_other {
  background: url(/images/bg_ohter.jpg) center center no-repeat;
  background-size: cover;
  /* background-attachment: fixed;*/
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 80px 0px 60px;
}

.other_ul {
  text-align: center;
  margin-bottom: 30px;
}

.other_ul ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: flex;
  -webkit-box-lines: multiple;
  -moz-box-lines: multiple;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}


.other_ul a:hover {
  opacity: 0.85;
  text-decoration: none;
}

.other_ul a {
  display: inline-block;
  width: 24%;
  margin: 0 .3%;
  vertical-align: top;
  background: rgba(255, 255, 255, .95);
  padding: 6px;
}

/*.other_ul li {
	display:inline-block;
	width:24%;
	margin:0 .3%;
	vertical-align:top;
	background: rgba(255,255,255,.95);
    padding: 6px;
} */


.other_ul li h3 {
  font-size: 2rem;
  margin-bottom: 10px;
  font-weight: bold;
}

.roundeline {
  border: 1px solid #fe65b7;
  border-radius: 15px;
  padding: 20px;
}

.roundeline p {
  color: #484848;
}

/*color*/
.tc01 {
  color: #fe65b7 !important;
}

.tc02 {
  color: #5ac9fb !important;
}

.tc03 {
  color: #a2c946 !important;
}

.tc04 {
  color: #a53598 !important;
}

.lc01 {
  border: 1px solid #5ac9fb !important;
}

.lc02 {
  border: 1px solid #a2c946 !important;
}

.lc03 {
  border: 1px solid #a53598 !important;
}




/*  section 09 - qna  */
.bg_qa {
  background: url(/lib/cmn_img/stripe_pt.png) repeat;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 80px 0px 60px;
  background-color: #fff5fa;
}







.flowList {
  text-align: center;
  margin-bottom: 30px;
}

.flowList li {
  display: inline-block;
  width: 20%;
  text-align: center;
  background: url(../images/line.gif) center 18% repeat-x;

}

.flowList li img {
  width: 65%;
}

.flowList li .txt span {
  display: block;
  font-size: 25px;
  font-family: 'notoserif';
  font-style: italic;
}

.flowList li .txt span small {
  font-size: 18px;
}

.flowList li .txt {
  font-size: 15px;
}

.snsArea .scInr {
  max-width: 1100px;
}

.fbArea {
  width: 50%;
  float: left;
}

.meetArea {
  width: 49%;
  float: right;
}

.meetArea ul {
  max-width: 490px;

}

.meetArea ul li a {
  display: block;
}

.meetArea ul li a:hover {
  -webkit-transform: translateY(-8px);
  transform: translateY(-8px);
}

.recArea th,
.recArea td {
  padding: 10px 30px;
}

.recArea th {
  border-right: 1px solid #ccc;
  width: 26%;
}

#instafeed li {
  float: left;
  margin-bottom: 20px;
  margin-right: 3%;
  width: 31%;
}

#instafeed li:nth-child(3n) {
  margin-right: 0;
}

#instafeed li img {
  width: 100%;
}




/* sp */
@media only screen and (max-width: 800px) {

  .other_ul a {
    width: 100%;
  }

  .other_ul li {
    margin: 0px !important;
  }

  .other_ul ul a {
    margin-bottom: 10px;
  }

}


/*20191121 add css*/

.catec08 {
  border-right: 3px solid #ff9a00 !important;
}

.catec09 {
  border-right: 3px solid #47e522 !important;
}

.catec10 {
  border-right: 3px solid #43c0f6 !important;
}

.colt08 {
  color: #ff9a00 !important;
}

.colt09 {
  color: #47e522 !important;
}

.colt10 {
  color: #43c0f6 !important;
}

.catebg08 {
  background: url(/images/col_catebg07.jpg) repeat;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background-size: cover;
}

.catebg09 {
  background: url(/images/col_catebg08.jpg) repeat;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background-size: cover;
}

.catebg10 {
  background: url(/images/col_catebg09.jpg) repeat;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background-size: cover;
}
