@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Archivo+Black&family=Be+Vietnam+Pro:ital,wght@0,900;1,900&family=Noto+Sans+JP:wght@400;500;700&display=swap');
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	background: transparent;
	border: 0;
	outline: 0;
	font-size: 1em;
	
}

a{text-decoration: none;color: #575757;}

/*----------------------------------------------------------------------------------
use color
red:#ce3a4c;
gold:#cda976;
yellow:#e1d388;
green:#018176;
nevy:#1e5778;
pink:#e464a5;
----------------------------------ALL use------------------------------------------------------*/
body{}
video{display: block;
	background-image:url("../img/ambk.gif");
	background-size: cover;
}
#container{
	position:relative;
	width: 100%;
	margin: 0 auto;
	text-align: center;
	font-family: 'Noto Sans JP', sans-serif;
	/*font-family: 'Zen Maru Gothic', sans-serif;*/
	font-weight: 400;
	overflow: hidden;
	color:#333;
	line-height: 2;
}
#container2{}
section{
	padding: 0px 5%;
	max-width: 750px;
	text-align: center;
	margin: 0 auto;
	position: relative;
overflow: hidden;}
.text{
	padding: 20px 10%;
	font-size: 1.2rem;
	line-height: 2.5;
	width: 80%;
}
h1{font-size: 2rem;
	color:hotpink;}
.btn{text-align: center;
	background-color: lightseagreen;
	display: inline-block;
	padding:5px 15px;
	font-family: 'Be Vietnam Pro', sans-serif;
}

.btn a{color: #FFFFFF;font-weight: 700;}

.abtn{text-align: center;background-color:hotpink;
	display: inline-block;padding:5px 15px;border-radius: 30px;}
.abtn a{color: #FFFFFF;font-weight: 700;}

.gn{background-color:#B3E7E0;}


/*--------------------------------------------------------------*/
#top{
	max-width: 1000px;
	margin: 0 auto;
	text-align: center;
	position: relative;
	
}
.top_sh{display: none;}

.Tttl{display: flex;position: absolute;top:20%;width: 300px;left:20%;}

.babydoll_Logo{position: absolute;top:10px;right: 15px;width: 150px;}
.top_cth{line-height: 1.8;}
.top_txt{padding-top:25px;}

.lineup{ max-width: 600px; padding: 50px 0;/**/display: flex; }
.lineup_item{flex-basis: 30%;/**/align-items: center;margin: 0 1%;/**/padding: 5px ;background-color: #f0f0f0;}
.lineup_sa{margin-top: 100px;}
.lineup_sk{margin-top: 50px;margin-bottom: 50px;}
.lineup_ul{margin-bottom: 100px;}
.circle{color: hotpink;}
.lineup_box {line-height: 1;padding-bottom: 30px;}
.rectangle{padding: 0;border-left: solid 1px hotpink;}
.numb{
	font-weight: 700;
	font-size: 2rem;
	 color: #FFFFFF;
	font-style: normal;
	font-family: 'Be Vietnam Pro', sans-serif;
  -webkit-text-stroke: 1px lightseagreen;
  text-stroke: 1px lightseagreen;
	line-height: 1.5;
}

.lineup_ttl{color:lightseagreen;font-size: 1.2rem;line-height: 1.5;}
.lineup_p{font-size: .85rem;line-height: 1.5;}
.fas_color{color:hotpink;font-weight: 400;}






.areaTtl{padding: 50px 0;}
.areaTtl_en{color:hotpink;font-weight: 700;font-size:1.2rem; margin: 0;line-height: 1;
	font-family: 'Be Vietnam Pro', sans-serif;
	font-style: italic;
}
.areaTtl h1{color:lightseagreen;}
.mtext{
	font-size: 1.5rem;
	width: 80%;
	padding-left: 10%;
	color:lightseagreen;
	line-height: 1.5;
	padding-top: 10px;
}



.Block1 {}
.Block2 {
  /*レイアウト用のCSS*/
  padding: 0px 0 40px 0;
  background-color: #F0F0F0;
  
}
.Block1 {
  position: relative;
  padding: 0px 0 50px 0;
  
}
.Block1::before{
  content:"";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 0;
  border-style: solid;
 
  /*ここで三角形のサイズを決める。
  必ず幅100vwにして、ブラウザサイズいっぱいにしてください。*/
  border-width: 0 0 70px 100vw ;
  border-color: transparent  transparent #f0f0f0 transparent;
}

.Block3{position: relative;
  padding: 0px 0 50px 0;background-color: #f0f0f0;}
.Block4{padding: 0px 0 40px 0;
  background-color: #FfFfFf;}
.Block3::before{
  content:"";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 0;
  border-style: solid;
 
  /*ここで三角形のサイズを決める。
  必ず幅100vwにして、ブラウザサイズいっぱいにしてください。*/
  border-width: 0 0 70px 100vw ;
  border-color: transparent  transparent #ffffff transparent;
}




.goods{display: flex;align-items: center;width: 100%;position: relative;}
.goods_item1{flex-basis:40%;}
.goods_item2{flex-basis:60%;}
.goods p{text-align: left;}
.ckp{border-bottom: solid 4px lightseagreen;}
.goods_icon{position:absolute;display: flex;align-items: center;left: 42%;top:50%;}
.rectangle_l{width: 35px; height: 1px;background-color: hotpink;}
.colors{margin: 0 auto;
	text-align: center;
	background-color: #fff;
	border-radius: 30px;
	z-index: 3;
	padding: 30px;
	max-width: 80%;}
.goods_price{display: flex;padding: 50px 0;align-items: center;}
.goods_price1{flex-basis: 70%;}
.goods_price2{flex-basis: 30%;}
.goods_price p{text-align: left;}
.redtext{color:firebrick;font-size: .85rem;}

.secen_item {display: flex;width: 100%;position: relative;padding: 50px 0;}
.secen_item1{flex-basis: 70%;}
.secen_item2{flex-basis:40%;padding-top: 45%;margin-left:-10%;}
.secen_item3{flex-basis: 85%;margin-left:-20%;}
.secen_item4{flex-basis:40%;padding-top: 15%;}
.secen_icon{position: absolute; right: 7%;top:-2%;}
.secen_icon2{position: absolute; left: 15%;top:10%;}
.secen_txt{
	z-index: 99;
	font-size: 3rem;
	font-weight: 700;
	color:rgba(227,215,215,0);
	margin-top:-80px;/**/
	font-family: 'Be Vietnam Pro', sans-serif;
	 }
.pk{-webkit-text-stroke: 1px hotpink;
  text-stroke: 1px hotpink;}
.gen{-webkit-text-stroke: 1px lightseagreen;
  text-stroke:1px lightseagreen;}
.back_gr{background-color: #f0f0f0;}
#skinny .secen_item1{flex-basis:65%;}
#skinny .secen_item2{flex-basis:45%;
	padding-top: 20%;
	margin-right:-10%;
	margin-left: 0;
	z-index: 9;
}
.secen_item0{text-align: center;margin: 0 auto;}
#skinny .secen_txt{position: absolute;top:0;margin-top: 0;right: 10%;} 
.goods_priceTZ{padding: 20px;}
.u_sc{max-width: 1280px;padding: 50px 0;margin: 0 auto;text-align: center;}
.slider{width: 100%;margin: 0 auto;text-align: center;}/**/
.bt2{width: 300px;margin: 0 auto;text-align: center;}
.goods_img{position: relative;}/**/

#ultra .secen_item1{flex-basis: 50%;}
#ultra .secen_item2{flex-basis:50%;padding-top: 5%;margin-left:-2%;}
#ultra .secen_item3{flex-basis: 50%;margin-left:0;padding-top: 5%;}
#ultra .secen_item4{flex-basis:50%;padding-top: 0;}

#ultra .secen_icon{top:16%;right: 0;}
#ultra .secen_icon2{left:0;}


/*-----------------------site-header---------------------*/
.site-header{

    display: none;
 
    position: absolute;

	z-index: 99999;
   /*font-family:  'Kaisei Opti', serif; */
}
.gnav__menu{
	width: 100%;

	justify-content:space-around;/**/
	
}
.gnav__menu__item{
	
	/*padding: 20px 20px;*/
	font-family: 'Be Vietnam Pro', sans-serif;
	height: 70px;
		width: 70px;
		padding:  5px;
	list-style: none; 
	border-radius: 50%;
		display:flex;
		align-items: center;
		justify-content:center;
	line-height: 1;
	
}
.gnav__menu__item a{color:#fff;}

.site-header.show{
	 display:flex;
    position: fixed;
    top:300px;
	z-index: 99999;
}



/*------------------------------------------------------------
	フッター
------------------------------------------------------------*/
#gFooter .fLinkList li a {
    padding: 29px;
    display: block;
    color: #666;
    font-size: 2rem;
    font-weight: 700;
    text-align: center;
    background-color: #e2e2e2;
}
#gFooter .fLinkList li a:hover {
    opacity: 0.7;
}
#gFooter address {
    padding: 35px 5px 56px;
    color: #666;
    font-size: 1.2rem;
    font-weight: 400;
    font-style: normal;
    text-align: center;
    font-family: "Helvetica Neue" , Helvetica , Arial , sans-serif;
    background-color: #D9D9D9;
}

#gFooter{
	
	bottom:0;

	}

@media all and (max-width: 749px) {
	.mainVisual{
		width:100vw;
		
	}
	.top_pc{display: none;}
	.top_sh{display: block;}
	section{padding: 0;}
	.mtext{font-size: 1.2rem;}
	#top{}
	.Tttl{width: 200px;left: 0;}
	
	.babydoll_Logo{width: 100px;right: 3px;top:0px;}
	.gift_icon{display: block; position: absolute;bottom: 5%;left:5%;width: 100px;}
	.text{font-size: 1.1rem;line-height:2;}
	h1{font-size: 1.3rem;}
	.lineup{ padding: 40px 10px 10px 10px;display: flex;}
	.lineup_item{font-size: .9rem;}
	
	.goods{width: 90vw;padding: 0 5vw;}
	.lineup_ttl{font-size: .7rem;line-height: 1.5;font-weight: 700;}
    .lineup_p{font-size: .85rem;line-height: 1.5;}
	/*.goods{display: block;}*/
	.goods_item1{flex-basis:55%;margin-right: -10%;}
    .goods_item2{flex-basis:80%;margin-right: -10%;}
	.goods_icon{display: none;}
	.rectangle_l{display: none;}
    .goods_item1 p{font-size: 1rem;line-height: 1.8;}
	.goods_price{display: block;}
	.goods_price1{padding-bottom: 30px;}
	.makaron{width: 40%;}
	.secen_txt{font-size: 2.5rem;}
	.secen_item_tz{display: block;padding-bottom: 0px;}
	#saruel .secen_item1{flex-basis: 80%;}
	#saruel .secen_item2{flex-basis: 55%;padding-top: 50%;margin-left:-15%;}
	#saruel .secen_item3{width: 100vw;margin-left: 0;}
	#saruel .secen_item4{padding-top: 0;margin: 0 auto;text-align: center;max-width: 400px;}
	#saruel .secen_icon2{top:12%;left:25%;}
	#skinny .secen_item1{flex-basis: 85%;}
	#saruel .secen_item2{flex-basis: 55%;padding-top: 50%;margin-left:-15%;}
	#skinny .secen_icon2{left: 5%;top:0;}
	#skinny .secen_item2{
	flex-basis:60%;
	padding-top: 40%;
	margin-right:-15%;
	margin-left: 0;
	z-index: 9;
}
	.book{width: 50%;transform: rotate(-15deg);}
	.secen_item{padding-bottom: 20px;}
	.Tttl_logo{width: 180px;}
	#ultra .goods{display: block;}
	#ultra .goods_item1{width: 80vw;left: 10vw; position: absolute;bottom:50px; }
	#ultra .goods_item2{width: 75vw;margin: 0 auto;text-align: center;padding-bottom:180px;}
	.gnav__menu{
		display: flex;
		/*width:50vw;*/
		
	}

	.gnav__menu__item{
		height: 50px;
		width: 50px;
		padding:  5px;/*0px*/
		margin: 0;
	    font-size: .9rem;
		border-radius: 50%;
		display:flex;
		align-items: center;
		justify-content:center;
		
		/*box-shadow: 0 0 2px #333;*/
		
	}
	/*.site-header{padding: 1vw;}*/


	
	
}








/*------------------------------------------------------------------------------
  anime
------------------------------------------------------------------------------*/

.starAct {
	animation: zoom-in-anim .9s infinite;
}

@keyframes zoom-in-anim {
	0% {
	transform: scale(.7);
		opacity: .6;
	}
	100% {
	transform: scale(.8);
		opacity: 1;
	}
}


/*--------------------------------------------slick-----------------------------------------*/
/*slider divのstyle設定*/
	.slider, .slider2{/*background-color: red;*/width: auto;text-align: center;margin: 0 auto;}
	/*slider各itemのstyle設定*/
	.slider_item{/*background-color: antiquewhite;*/width: 100%;}
	/*slider各item画像幅を100%設定*/
	.slider_item img{width: 100%;}
	/*dotsの位置はitemの外；dotsのstyle*/
	.slick-dots{/*background-color: #D7BCBC;*/}
	/*arrowの位置はslickの外；arrowのstyle*/
	.slick-prev{background-color: aquamarine;}
	.slick-next{background-color: aquamarine;}