@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Paytone+One&display=swap');
@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');
/* CSS Document */
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;
	font-family: 'Noto Sans JP', sans-serif;
	
}
.ttl{
	font-family: 'Paytone One', sans-serif;
	font-size: 2.5rem;
	line-height: 1.2;
	color:#C23922;
	/*min-width: 400px;-webkit-text-stroke: 2px #E7E0CF;
  text-stroke: 2px #E7E0CF;*/
}
.small2{font-size:1.2rem;font-family: 'Paytone One', sans-serif;}
a{text-decoration: none;color: #B66D5C;}
#container{
	position:relative;
	width: 100%;
	margin: 0 auto;
	text-align: center;
	font-family:'Kosugi Maru', sans-serif;
	font-weight: 500;
	overflow: hidden;
	line-height: 2;
	background-color: #ffffff;
}
#top{
	background-color: #FFF6E9;
	position: relative;
	}
.yl{background-color: #F2C242;}
.off{background-color: #FFF6E9;}
.rd{background-color: #B66D5C;}
.bu{background-color: #4197BD;}
.video{
	width: 80%;
	margin-left: 12%;margin-right: 8%;
	padding: 50px;
	position: relative;
}
video{margin-bottom:-10px;
	background-image: url("../img/bk1.jpg");
	background-size: cover;}
.icon{position: absolute;}
.icon_1{
	top:20%;
	width: 280px;
	left: -15%;	
}
.icon_2{
	top:65%;
	left: -6%;	
}

.icon4 img{margin-bottom: -10px;}
.boxit{display: flex;/**/}
.boxCenter{align-items: center;}
.boxtz{padding: 100px 0;}
.item{flex-basis: 50%;position: relative;}
.item_txt{padding: 10%;}
.item_img{padding:0 15%;}
.img02_tz{margin-bottom: -50%;}
.img02{border: solid 15px #E7E0CF;}
.tz4{margin-top: 3%;}
.tz1{flex-basis: 40%;padding: 5%;}
.ttz1{padding: 0%;}

.slider{padding: 60px 0;background-color: #B66D5C; }
.slider img{border-radius: 50%;}


.s1{width: 70%;}
.s2{left:-1%;bottom:0%;width: 22%;}/**/
.tz2{flex-basis: 40%;padding-right: 15%;padding-left: -5%;}

.icon1_2{top:-10%;right: -15%;}
.icon4{padding:0; margin-left: -50%;margin-top: 10%;}
.img05{padding: 0 10% 0% 10%; width: 80%;}
.ttz2{padding: 0%; margin-top: 15%;}
.video2{max-width: 750px; padding: 100px;margin: 0 auto;text-align: center;}
.video2 video{background-image: url("../img/bk2.jpg");background-size: cover;}
.tz3{flex-basis: 40%;padding-left: 15%;padding-right: -5%;}

.img08{padding: 7%;max-width: 750px;margin: 0 auto;text-align: center;position: relative;}
.icon3{right: 0;bottom:-20%;transform: rotate(10deg);}
.icon_2_2{margin-top: 50px;margin-left: 50px;}
.more_bt{display: inline-block;

	margin:0 20% 10% 20%;
	width: 60%;
	padding: 10px 0;
	border-radius: 10px;
}
.small{font-weight: 700; font-size: .9rem;}

/*---------------------------babydoll------------------------*/
.lbu{background-color: #E5EBF3;}
.bdicon1{top:15%;left:-5%;}
#bdtop{background-color: #fff;position: relative;}

.bd_img01{border: solid 15px #EFEFEF;}
.bd_img02{transform: rotate(8deg);margin-bottom: -10%;width: 55%;}
.bd_img03{transform: rotate(-10deg);width: 55%;}
.bd_img0{transform: rotate(-5deg);margin-bottom: -20%;width: 55%;}
.bd a{color:#727DAA;}
.bd_icon3{top:-35%;}
.pe{width: 10%;}
.icon_ani{right: 5%;top:-5%;}
.icon_bd{transform: rotate(90deg);
	font-size: 4rem; 
	font-family:'Paytone One', sans-serif; 
	top:40%;left: -15%;
	color:#161471;
	letter-spacing: 1rem;}
.icon_cl{top:-30%;right:0%;z-index: 999;}
.bd .s1{width: 55%;}
.bd .tz2{flex-basis: 40%;padding-right: 15%;padding-left: -5%;}
.bd .icon4{padding:0; margin-left: -50%;margin-top: 3%;}
.bd_icon4{bottom:-60%;right: -20%;transform: rotate(5deg);}
#simple2{display: block;}
#simple3{display: none;}
.banner{margin-bottom: -10px;}
.red{font-size: .8rem;line-height: 1;}
.red a{color:indianred;}
.item_txt_pc{display: block;}
.item_txt_sp{display: none;}
/*--------------------------------------------------------------*/


@media all and (max-width: 749px) {
	.boxit{display: inline-block;}
	.video{
		width: 100%;margin: 0;padding: 90px 0 0 0;}
	.icon_1{top:0;left: 57%;width: 45%;}
	.icon_2{display: none;}
	.more_bt{
	margin:0 10% 10% 10%;
	width: 80%;	
}
	.ttl{font-size:2rem;line-height: 1.2;}
	.img02_tz{margin-bottom: 80px;transform: rotate(-3deg);margin-left: 5%;/*padding-right:10px;*/}
	.ttz1{padding-top: 20px;padding-bottom: 50px;}
	.img05{padding:10%;}
	.icon1_2{top:-27%;right: -50%;}
	.slider{margin-top: -8px;}/**/
	.video2{width: 100%;
		margin: 0;
		padding-top:50px;
		padding-left: 0px;
		padding-right: 0px;
		padding-bottom: 0px;}
	.tz3{flex-basis: 40%;padding-left: 15%;padding-right: -5%;padding-bottom: 50px;}
	.img08{margin-top: -70px;}
	.icon3{right: 0;bottom:-30%;transform: rotate(10deg);width: 70%;}
	.s2{transform: rotate(6deg);bottom:-15%;}/**/
	.bdicon1{top:5%;left:-3%;width: 50%;}
	.pe{padding-top:20px;display: flex;width: 20%;margin-left: 20%;margin-right: 20%;}
	.icon_bd{left:-20%;font-size: 2rem}
	.cool{width: 50%;/**/}
	.bd_icon3{top:-20%;}
	.icon_cl{top:-75%;right:0%;}
	.icon_ani{display: none;}
	.bd_img05{background-color: #efefef;}
	.bd .tz2{/*flex-basis: 40%;padding-left: 15%;padding-right: 0%;*/padding-top: 40px;}/**/
	#simple2{display: none;}
   #simple3{display:block;}
	.item_txt_pc{display: none;}
    .item_txt_sp{display: block;}
	.s1_sp{margin-bottom: 50px;}
	.flex_bdimg{display: flex;flex-wrap: wrap;/*background-color: red;*/}
	.flex_bdimg img{width: 45%;}
	.bd_img0{margin-bottom: 0%;}
	.bd_img02{margin-bottom: 0%;}
}
    







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

    display: none;
 
    position: absolute;

	z-index: 99999;
   
}
.gnav__menu{
	width: 100%;

	justify-content:space-around;/**/
	
}
.gnav__menu__item{
	
	
	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;
}
.sm_tz{display: none;}

@media all and (max-width: 749px) {
.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;*/
		
	}
}
/*------------------------------------------------------------
	フッター
------------------------------------------------------------*/
#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;

	}
/*---------------------------slider item-------------------------------------------------------------*/

/* 共通（ナビゲーションのwidth,height） */
.sp-button {
  width:calc( 40% / 2 - 3% );
  height:2px;
  position:relative;
  background:#fff;
  border-radius:0;
  border:0;
}
/* before要素 */
.sp-selected-button:before{
  animation-name: sliderpro-bg-color01;
  animation-duration: 3500ms;
  animation-timing-function:linear;
  width:0;
  content:'';
  display:inline-block;
  height:100%;
  background:#F7B013;
  top:0;
  left:0;
  position:absolute;
}
@keyframes sliderpro-bg-color01 {
  0% { width:0;}
  100% { width:100%;}
}




/*--------------------------animeIcon------------------------------------*/
.mjAction_1{
 
display: inline-block;
  padding:0px 5px;
  box-sizing: border-box;
  background: #B66D5C;
border-radius: 20px;
 box-shadow: 0px 0px 0px 5px #B66D5C;
  border: solid 2px #DFD4B9;
	 transform: rotate(-10deg);/* */
}
.mjAction_bd{
	background: #161471;
	box-shadow: 0px 0px 0px 5px #161471;
	border-radius: 0;
	border-color:#fff;
	transform: rotate(10deg);
}

.mjAction_1 p{
	text-shadow: none;
  font-size: 1.6rem;
/*font-family:'Shizuru', cursive;*/
 /* font-weight: bold;*/
	line-height: 2;
  letter-spacing: .2em;
  color: #DFD4B9; 
	overflow: hidden;
	white-space: nowrap;
	animation: typing 3s steps(8,end) infinite;
}
.mjAction_bd .antxt_bd{color:#fff;}
@keyframes typing{
  0% {width: 0;}
 45%{width:100%;}/*動きに間隔を空ける（1.5s空ける）*/
 90%{width: 100%;}	
	
}
.anime2{
	font-family:'Paytone One', sans-serif;
	font-size: 1.5rem;
	display:inline-block;
	padding:0px 5px;
  box-sizing: border-box;
 
color:#DFD4B9;
 
  border: solid 2px #DFD4B9;
	 transform: rotate(10deg);/* */
	animation:colorchange .6s infinite;
}
.anime3{
	color:#fff;
	border-color:#fff;
	animation:colorchange2 .6s infinite;
	transform: rotate(-10deg);
}
@keyframes colorchange{
  0% {background: #4197BD;box-shadow: 0px 0px 0px 5px #4197BD;}

 100%{background: #67ACCA;box-shadow: 0px 0px 0px 5px #67ACCA;}	
	
}
@keyframes colorchange2{
  0% {background: #161471;box-shadow: 0px 0px 0px 5px #161471;}

 100%{background: #161471;box-shadow: 0px 0px 0px 5px #161471;}	
	
}




.circle-text {
	position:relative;
	width: 200px; /* 直径 */
	height: 200px; /* 直径 */
	font-size: 20px;
	text-align: center;
	margin: 0;/**/
			padding: 0;
	transform: rotate(-90deg); /* 円の回転 回転の始まりを指定する アニメーションなしの場合に使用*/
	animation: rotate1 20s linear infinite;
	transform-origin: center;
	color:#161471;
			
}

		.circle-text span{
	
			position:absolute;
			top:0;
			left:calc(50%-15px);/*50% 中心点、、文字サイズ分ずらす。なしでもok*/
			display: inline-block;
			width: 20px;/* 文字サイズより小さくしない */
			 height: 100px;/*半径 */
			transform-origin: center bottom;/* 回転の基準点 */
			 
			/*border:solid 1px;*/
			
		}

		@keyframes rotate1 { 
  0% {
   transform: rotate(0deg);
  }
	100% {  
    transform: rotate(360deg);
  }
}
/*-------------------------↓↓↓↓↓---------------------------------------
360を記述する文字数で割った数字を文字毎の角度を調節していけば何文字の円でも作成可能です。
文字サイズを調節しないと重なったりはします。

例えば、27文字を使う場合は、360÷27＝おおよそ13.33度ずつずらして回転させます。
ーーーーーーーーーーーーーーーーーーー↓↓↓↓↓ーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/		
		
		
.circle-text span:nth-child(1) {
	transform: rotate(0deg);
}

.circle-text span:nth-child(2) {
	transform: rotate(32.7deg);
}

.circle-text span:nth-child(3) {
	transform: rotate(65deg);
}

.circle-text span:nth-child(4) {
	transform: rotate(98deg);
}

.circle-text span:nth-child(5) {
	transform: rotate(131deg);
}

.circle-text span:nth-child(6) {
	transform: rotate(164deg);
}

.circle-text span:nth-child(7) {
	transform: rotate(197deg);
}

.circle-text span:nth-child(8) {
	transform: rotate(230deg);
}

.circle-text span:nth-child(9) {
	transform: rotate(263deg);
}

.circle-text span:nth-child(10) {
	transform: rotate(296deg);
}

.circle-text span:nth-child(11) {
	transform: rotate(330deg);
}