@charset "utf-8";
/* base.css */
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}
dl,dl dt,dl dd,ul,li,h3{margin:0;padding:0;;}


html {font-size: 62.5%;}

body {
  -webkit-text-size-adjust: 100%;
  color:#333;
  font-size: 1.4rem;
  line-height: 1.7;
  font-family: Verdana, Roboto, "Droid Sans", "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
  background: #fff url('../images/');
/* max-width: 800px; */
  margin: 0 auto;}

.clearfix:after {content: "";clear: both;display: block;}

img {max-width: 100%;display: block;margin: 0 auto;}

a:hover {opacity: .7;}

h1 {margin: 0;}
h2 {font-size: 1.8rem;margin: 0;}
h2, h3, h4 {line-height: 1.2;margin: 0;}

h3,
dl.btnArea dt {font-family: YuGothic, "Yu Gothic bold", "Hiragino Sans", Meiryo, "sans-serif";}

.btn {text-align: center;}
.btn input {max-width: 100%;}

p {margin: 0 0 1em 0;line-height: 150%;}

.display-blk {display: block;}

.pc {display: none;}


/*-------------------
	color
--------------------*/
.white {color: #fff;}
.pink {color: #ec0677;}
.orange {color: #EF4E23;}


/*-------------------
	margin & padding
--------------------*/
.mb0{margin-bottom:0!important;}
.mb30{margin-bottom:30px!important;}
.mb50{margin-bottom:50px!important;}

.mt0{margin-top:0!important;}
.mt30{margin-top:30px!important;}
.mt50{margin-top:50px!important;}
.mt80{margin-top:80px!important;}

.pt50{padding-top:50px!important;}
.pb50{padding-bottom:50px!important;}


/*-------------------
	header
--------------------*/
header#head_wrap {
    position: fixed;
    top: 0;
    width: 100%;
    /* margin: 100px auto 0; */
    line-height: 1;
    z-index: 999;
    text-decoration: none;
    background-color: #fff;
	padding:15px 0;
}

#head_wrap a {text-decoration: none;}
#head_wrap .inner {width:100%;margin: 0 auto;position:relative;max-width: 800px;text-align: right;}
#head_wrap .inner:after {content: "";clear: both;display: block;}

#head_wrap a {display:inline-block;}

#head_wrap a.logoL {position: absolute;left:15px;width:118px;max-width:30%;}
#head_wrap a.logoR {width:189px;max-width:30%;}


/*-------------------
	TopVisual
--------------------*/
.topVisual {width:100%;margin: 0;padding-top:88px;}
.topVisual h1 {width:100%;margin: 0 auto;}
.topVisual h1 small{display: none;}

/*-------------------
	Layout
--------------------*/
.wrap-contents{background-color:#faf8ee;padding:0;}
.wrap-contents0{background-color:rgba(255,255,255,0.5);}

.box-wrap0{width:100%;margin:0 auto;padding:0;}
#features .box-wrap0,
#products .box-wrap0{padding:0!important;}

/*-------------------
	BRAND CONCEPT
--------------------*/
#concept{background-color: #6e6e6d;color:#fff;}
#concept .box{height:100%;position:relative;padding:0;}
#concept h2 {background:url('../images/ttl_concept.webp') top left no-repeat;background-size:contain;width:95%;min-height:35px;margin-left:5%;}
#concept h2 span{display:none;}
#concept ul{padding:5%;width:100%;}


/*-------------------
	FEATURES
--------------------*/
#features{background:url('../images/bg_ptn.jpg') top left repeat-Y;background-size:contain;padding:0 5% 10%;}
#features h2 {background:url('../images/ttl_features.webp') top right no-repeat;background-size:contain;width:100%;min-height:40px;margin-bottom:7.5%;}
#features h2 span{display: none;}

#features dl.box {background:url('../images/point_bg_t.webp') top center no-repeat;background-size:cover;padding-top:3.45%;}
#features dl.box dt {display:table;width:100%;}
#features dl.box dt h3 span, 
#features dl.box dt h3 b {display:inline-table;text-indent: -10000px;}

#features dl.box dt h3 span {width:18.75%;min-width:60px;height:96px;}
#features dl.box dt h3 b {width:81.25%;height:96px;}

#features dl.box dt h3.point01 span {
	background:#666 url('../images/point01_t.webp') center center no-repeat;background-size:contain;}
#features dl.box dt h3.point02 span {
	background:#666 url('../images/point02_t.webp') center center no-repeat;background-size:contain;}
#features dl.box dt h3.point03 span {
	background:#666 url('../images/point03_t.webp') center center no-repeat;background-size:contain;}

#features dl.box dt h3.point01 b {
	background: url('../images/point01_copy.webp') top left no-repeat;background-size:contain;}
#features dl.box dt h3.point02 b {
	background: url('../images/point02_copy.webp') top left no-repeat;background-size:contain;}
#features dl.box dt h3.point03 b {
	background: url('../images/point03_copy.webp') top left no-repeat;background-size:contain;}

#features dl.box dd p {padding:5%;margin-bottom:0;}

/*-------------------
	PRODUCTS
--------------------*/
#products{margin:0 auto;padding:0 5% 7.5%;width:100%;}
#products h2 {background:url('../images/ttl_products.webp') top left no-repeat;background-size:contain;margin-bottom:7.5%;width:100%;min-height:40px;}
#products h2 span{display: none;}

#products .box {background:#fff url('../images/product_squ.webp') top left no-repeat;box-shadow: 0 0 8px 0 #999;padding:0;}

#products .box h3 {font-size:1.5em;font-weight:800;padding:8.5% 0;text-align: center;}
#products .box h3 span {font-weight:normal;font-size: 0.6em;}
#products .box h3 span {display:block;color:#999;margin-top:10px;}

#products .box dl dd {padding:5% 5% 0;}

#products .box dl.btnArea,
#products .box dl.btnArea dt,
#products .box dl.btnArea dd,
#products .box dl.btnArea dd ul,
#products .box dl.btnArea dd ul li{display:inherit;margin:0;padding:0;width:100%;}

#products .box dl.btnArea{background:#f1efe8 url('../images/btnarea_icon.webp') top left no-repeat;margin-top:1.5em;padding:3.5%;}

#products .box dl.btnArea dt{font-size:1.15em;font-weight:bold;margin-bottom:3.5%;text-align:center;}
#products .box dl.btnArea dt{font-size:1.15em;font-weight:bold;margin-bottom:3.5%;text-align:center;}

#products .box dl.btnArea dd ul{display:table;text-align:center;width:100%;}
#products .box dl.btnArea dd ul li{display:inline-table;padding-right:1.5%;width:48.5%;}
#products .box dl.btnArea dd ul li a {background-color:#fff;border:3px solid #008d60;border-radius:8px;display:inline-block;padding:5px;width:100%;}

#products .box dl.btnArea dd ul li.gray-out {opacity: 0.2;filter:grayscale(100%);pointer-events:none;}

/*-------------------
	Top
--------------------*/
.mv {padding-bottom:20px;}

.product-detail {font-size:1.6rem;padding:20px 5%;}

.product-detail>h2{color:#65543d;text-align: left;
  font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
  font-size: 1.8rem;}

.product-detail dl{display: block;}
.product-detail dt,
.product-detail dd{display:block;text-align: center;margin:15px 0;padding:0;}

.detail {font-size: 1.6rem;padding:20px 5%;}
.detail .name strong {font-size:1.8rem;}

.detail_s {font-size:1.2rem;padding: 20px 5%;}

.txtPink {color:#97437b;font-size:1.6rem;font-weight:700;text-align:center;}
.txtPink strong {font-size:2rem;}

/*-------------------
	accordion
--------------------*/
.accordion {margin: 0;}
.accordion dt {padding: 12px 2.5%;font-weight: bold;border-top:3px solid #FCE0AF;border-bottom:3px solid #FCE0AF;margin-bottom:1em;font-size:1.25em;color:#FCE0AF;position: relative;}
.accordion dt::after {display: inline-block;position: absolute;content: "＋";right:2.5%;font-size: 1.2em;font-weight: bold;}
.accordion dd {margin: 0;padding:15px 0 30px;display: none;}
.accordion dd p {margin:0;padding:0;}

.twitter {position: relative;}
.twitter .item01 {position: absolute;left: 25%;bottom: 22%;width: 50%;}


/*-------------------
	Youtube
--------------------*/
.youtube {text-align: center;background: #ffffff;}
.youtube .iframe {padding: 5px 20px 60px;}
.youtube .iframe iframe {margin-bottom: 20px;max-width: 100%;background: #ffffff;}

/*-------------------
	Link
--------------------*/
.btnarea {background-color:#f1c7c0;margin:0;padding:30px 20px;}
.btnarea.bg-color {background-color:#eecda1;}
.btnarea li {position: relative;}
.pop-box label:hover {cursor: pointer;opacity: .7;}
.popup, .popup02, .popup03 {
  display: none;
  position: absolute;
  margin: -10px 4% 0;
  width: 92%;
  background: #fff;
  z-index: 10;}
.popup li, .popup02 li, .popup03 li {
  padding: 10px;
  border: 3px solid #ec0677;
  margin-top: -3px;}
/* チェックボックスの初期設定 */
#popup-on, #popup-on02, #popup-on03 {display: none;}
/* チェックされたらポップアップウインドウを開く */
#popup-on:checked + .popup, #popup-on02:checked + .popup02, #popup-on03:checked + .popup03 {display: block;}


/*-------------------
	About
--------------------*/
.about {background:#115424;padding:5%;position:relative;}
.about dl {background:#fff;border-radius:20px;margin:0;padding:3.125%;position:relative;}
.about dl dt,
.about dl dd {margin:0;padding:0;}
.about dl dt {margin-top:10px;margin-bottom:20px;}
.about dl dt img {width:200px;}
.about dd p {font-size:14px;margin:0 0 20px;text-align:center;}
.about ul {margin-top: 5px;}
.about li {display:inline-block;}
.about li:before {content: "｜";display:inline-block;margin:0;color:#fff;}
.about li:first-child:before {display:none;}
.about li a {color:#fff;font-size:12px;text-decoration:none;}

.copy {color: #fff;font-size: 1rem;margin:0 !important;}
.logo {display:block;margin:10px auto 0;}

.center {text-align:center;}
.right {text-align:right;}

/*-----------------------
  footer
-----------------------*/
.sns_title {
  padding: 5px 0 4px !important;
  line-height: 0;
  text-align: center;
  background: #ee5a8c;
  background: -moz-linear-gradient(top, #ee5a8c 0%, #f288ac 100%);
  background: -webkit-linear-gradient(top, #ee5a8c 0%, #f288ac 100%);
  background: linear-gradient(to bottom, #ee5a8c 0%, #f288ac 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ee5a8c', endColorstr='#f288ac', GradientType=0);}
.social-area-syncer {margin: 25px 0;}
.social-button-syncer li {display:inline-block;vertical-align: bottom;}
.foot_link {margin:0 auto;max-width:640px;text-align:center;}
.wp-caption-text {display:inline-block;padding: 20px 2%;}
.sns_link {margin:0;padding:0;}
.sns_link li {display:table-cell;width:2000px;max-width:50%;list-style: none;text-align:center;}
.sns_link .fb {background:#395B9A !important;text-align:right;}
.sns_link .ig {background:#e5425a;}
.sns_link .twi {background:#54ABEE;}
.sns_link li a {
  color: #fff;
  display: inline-block;
  width: 100%;
/* max-width: 440px; */
  text-align: center;
}
.clearfix { /*zoom: 1;*/}

.clearfix:after {
  content: "";
  clear: both;
  display: block;
  font-size: 0.1em;
  line-height: 0;
  overflow: hidden;}
.fb_iframe_widget iframe {position:relative !important;}
.main .btn2 {clear:both;text-align:center;width: 100%;}


/*----------------------------------------------------
	For PC
-----------------------------------------------------*/
@media screen and (min-width: 640px) {
  body {font-size: 1.6rem;}
  .pc {display: block;}
  .sp {display: none;}
.about {padding:50px;}
.about dl dt img {width:292px;}
.about .logo {margin:0;position: absolute;right:30px;bottom:15px;}

/*-------------------
	TopVisual
--------------------*/
.topVisual {padding-top:88px;}

/*-------------------
	Layout
--------------------*/
.wrap-contents{}
.box-wrap0{margin:0 auto;padding:7.5% 0 0;width:100%;max-width:800px;}


/*-------------------
	BRAND CONCEPT
--------------------*/
#concept h2 {min-height:46px;}
#concept .pc {display: none;}
#concept .sp {display:block;}

/*-------------------
	FEATURES
--------------------*/
#features{padding:0 5% 10%;}
#features h2 {min-height:60px;margin-bottom:5%;}
#features h2 span{display: none;}

#features dl.box {background:url('../images/point_bg_t.webp') top center no-repeat;background-size:cover;padding-top:3.45%;}

#features dl.box dt h3 span, 
#features dl.box dt h3 b {display:inline-block;text-indent: -10000px;}

#features dl.box dt h3 span {width:18.75%;max-width:150px;height:150px;}
#features dl.box dt h3 b {width:81.25%;height:150px;}

/*-------------------
	PRODUCTS
--------------------*/
#products{padding:0 5% 5%;}
#products h2 {min-height:60px;margin-bottom:5%;}
#products h2 span{display:none;}

#products .box {padding:5% 0 0;}
#products .box h3 {font-size:1.75em;padding:0 5% 5%;text-align: left;}

#products .box dl.btnArea{margin-top:5%;padding:3.5%;text-align:left;}
#products .box dl.btnArea dt{font-size:1.25em;margin-bottom:3.5%;text-align:left;}
#products .box dl.btnArea dd{margin:0;padding:0;}
#products .box dl.btnArea dd ul{margin:0;padding:0;}
#products .box dl.btnArea dd ul li{padding-right:1%;width:25%;}
	
}


@media screen and (min-width: 800px) {
body {font-size: 1.6rem;}
/*-------------------
	BRAND CONCEPT
--------------------*/
#concept .pc {display: block;}
#concept .sp {display: none;}
#concept h2 {position:absolute;top:0;left:0;width:95%;min-height:60px;}
#concept .box .wrap{display:table;width:100%;}
#concept ul{float:left;font-size:1.2em;padding:90px 2.5% 0 7.5%;width:60%;}
#concept ul li{margin-top:0.5em;}
#concept ul li:last-child{padding-bottom:5%;}
#concept picture{float:right;width:40%;vertical-align:text-bottom;height:100%;}
}