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


/*
font-family: source-han-sans-japanese, sans-serif;
font-weight: 400;
font-style: normal;
*/
/*
font-family: nimbus-sans, sans-serif;
font-weight: 400;
font-weight: 700;
font-style: normal;
*/
/*
font-family: futura-pt, sans-serif;
font-weight: 500;
font-style: normal;
*/

/*
.guide,
.guide1{opacity: 0.3;z-index: 1000;position: relative;}

body:before{content: '';position: fixed;width: 1px;left: 50%;top: 0;bottom: 0;background: #FF0004;opacity: 0.3;z-index: 1000;}
.guide:before{content: '';position: fixed;width: 1px;left: 10.25%;top: 0;bottom: 0;background: #FF0004;}
.guide:after{content: '';position: fixed;width: 1px;right: 10.25%;top: 0;bottom: 0;background: #FF0004;}
.guide1:before{content: '';position: fixed;width: 1px;left: 23%;top: 0;bottom: 0;background: #FF0004;}
.guide1:after{content: '';position: fixed;width: 1px;right: 23%;top: 0;bottom: 0;background: #FF0004;}
*/

/* ---------- RESET ---------- */
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, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, b, u, i, center, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,
time, mark, audio, video, textarea, input {margin:0;padding:0;border:0;font-size: 100%;font:inherit;vertical-align: baseline;text-decoration:none;}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
body {line-height: 1;}
ol, ul, li {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,q:before, q:after {content: '';content: none;}
table {border-collapse: collapse;border-spacing: 0;}
input, textarea, button{-webkit-apparence:none;border:none;background: none;outline: none;}
input:focus, textarea:focus{-webkit-apparence:none;outline: none;border:none;}
img{border:none;outline:none;vertical-align:top;font-size:0;line-height:0;}
img a{border:none;outline: none;}
a:focus{outline:none;}
hr {height:0;margin:0;padding:0;border:0;}
h1, h2, h3, h4, h5, h6, p{margin: 0;padding: 0;border: 0;font-size: 100%;font: inherit;vertical-align: baseline;text-decoration:none;}
input, textarea, button{-webkit-apparence:none;border:none;background: none;outline: none;}

img{width:100%;height:auto;backface-visibility:hidden;-webkit-backface-visibility:hidden;transform:translate3d(0,0,0);}

*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-box-shadow:none;box-shadow:none;   outline:none;box-sizing:border-box;margin:0;padding:0;}
/*----------------------------------*/


html{
	width: 100%;
	height: 100%;
	font-size: clamp(14px , 1.2vw ,18px);
}

body{
	-webkit-text-size-adjust: 100%;
	font-style: normal;
	color:#053251;
	line-height: 1;
	font-weight: 400;
	background: #FFF;
	width: 100%;
	height: 100%;
	font-family: "source-han-sans-japanese", "游ゴシック体", "YuGothic", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "verdana", sans-serif;
}




/*
.guide,
.guide1,
.guide2,
.guide3,
.guide4{opacity: 0.5;z-index: 1000;position: relative;}

body:before{content: '';position: fixed;width: 1px;left: 50%;top: 0;bottom: 0;background: #FF0004;opacity: 0.5;z-index: 1000;}
.guide:before{content: '';position: fixed;width: 1px;left: 15.6%;top: 0;bottom: 0;background: #FF0004;}
.guide:after{content: '';position: fixed;width: 1px;right: 15.6%;top: 0;bottom: 0;background: #FF0004;}
.guide1:before{content: '';position: fixed;width: 1px;left: 26.56%;top: 0;bottom: 0;background: #FF0004;}
.guide1:after{content: '';position: fixed;width: 1px;right: 26.56%;top: 0;bottom: 0;background: #FF0004;}
.guide2:before{content: '';position: fixed;width: 1px;left: 40.9%;top: 0;bottom: 0;background: #FF0004;}
*/




#loader-bg{
    position:fixed;
    width:100vw;
    height:100vh;
    top:0px;
    left:0px;
    z-index:10000;
	background: #FFF;
}

.inView{
	position: relative;
	opacity: 0;
	-webkit-transition:opacity 1.8s cubic-bezier(0.11, 0, 0.5, 0);
	transition:opacity 1.8s cubic-bezier(0.11, 0, 0.5, 0);
}
.inView.view{opacity: 1;}


#wrapper{
	width: 100%;
	overflow: hidden;
	background: #e5f9f9;
}


/*----------------*/


.header{
	width: 100%;
	height: 100vh;
	position: relative;
	background: #FFF;
}
.vegas{
    width: 100%;
    height: 100%;
    position: relative;
	z-index: 10;
	overflow: hidden;
}
.vegas .vegasImage{
	position: absolute;
    width:100%;
	top: 0;
	bottom: 0;
}

.header .title{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 20;
}
.header .title h1{
	position: absolute;
	top:45%;
	left: 0;
	right: 0;
	margin: 0 auto;
	width: 20em;
	-webkit-transform:translateY(-50%);
	transform:translateY(-50%);
}
.header .title h2{
	position: absolute;
	bottom:10%;
	left: 0;
	right: 0;
	margin: 0 auto;
	width:18em;
	-webkit-transform:translateY(50%);
	transform:translateY(50%);
}



/*----------*/

.textWhite{color: #FFF;}

.bkBlue{background: #e5f9f9;padding-top: 3em;}
.bkYellow{background: #fffad2;}




.inView{
	position: relative;
	opacity: 0;
	-webkit-transition: opacity 1.5s;
	transition: opacity 1.5s;
}
.inView.view{opacity: 1;}


/*----------*/

.fixdContents{
	position: fixed;
	z-index: 500;
	top: 0;
	left: 0;
	width: 100%;
}
.topElement{
	width: 95%;
	z-index: 5;
	margin: 1em auto 0;
	font-size: 1.06em;
	font-family: futura-pt, sans-serif;
	font-weight: 500;
	letter-spacing: 0.02em;
	color: #053251;
	-webkit-transition: color 0.1s;
	transition: color 0.1s;
	display: flex;
	justify-content:flex-start;
}
.topElement.is-over {/*color: #FFF;*/}
.topElement.pc-over{color: #FFF;}

.topElement .text01{width: 18.5%;}
.topElement .text02{width: 21%;}
.topElement .text03{width: 18%;}
.topElement .text03 span{display: none;}
.topElement .text04{width: 17.5%;}
.topElement .text05{width: 11%;}
.topElement .counter{width: 14%;text-align: right;}
.topElement .looks{width: 14%;text-align: right;}

/*-------*/

.mainNaviTrigrer{
	position: fixed;
	right: 1.6em;
	bottom: 1.6em;
	width: 4.3em;
	height: 4.3em;
	z-index: 50;
	cursor: pointer;
}
.mainNaviTrigrer::after{
	content: '';
	position: absolute;
	top:0;
	left: 0;
	right: 0;
	bottom: 0;
	border-radius: 50%;
	z-index: 10;
	background: #053251;
	-webkit-transition: all 0.4s;
	transition: all 0.4s;
}
@media(min-width:769px) {
.mainNaviTrigrer:hover::after{top:-0.3em;left: -0.3em;right: -0.3em;bottom: -0.3em;}
}
.mainNaviTrigrer span{
	position:absolute;
	left:0;
	right: 0;
	margin: 0 auto;
	width:32%;
	top: 50%;
	height:1px;
	opacity: 1;
	background-color:#FFF;
	z-index: 20;
}
.mainNaviTrigrer span:nth-of-type(1){
	top: calc(50% - 0.6em);
}
.mainNaviTrigrer span:nth-of-type(2){
	top: calc(50% + 0.6em);
}

.mainNavi{
	position: fixed;
	z-index:600;
	width: 100%;
	top: 0;
	left: 0;
	bottom: 0;
	font-size: 15px;
	visibility: hidden;
	-webkit-transition: visibility 0.6s;
	transition: visibility 0.6s;
}

.mainNavi .overlay{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 10;
	opacity: 0;
	background: rgba(0,0,0,0.6);
	-webkit-transition: opacity 0.5s;
	transition: opacity 0.5s;
}
.mainNavi .naviBody{
	position: absolute;
	top: 0;
	bottom: 0;
	right: -37em;
	width: 37em;
	background: #FFF;
	z-index: 30;
	-webkit-transition: right 0.6s cubic-bezier(0.65, 0, 0.35, 1);
	transition: right 0.6s cubic-bezier(0.65, 0, 0.35, 1);
}

.mainNavi.open{visibility: visible;}
.mainNavi.open .overlay{opacity: 1;}
.mainNavi.open .naviBody{right: 0;}

body.fixed{position: fixed;top: 0;}



.mainNavi .close{
	position: absolute;
	right: 1.5em;
	top: 1em;
	width: 3em;
	height: 3em;
	z-index: 50;
	cursor: pointer;
	border-radius: 50%;
	background: #053251;
}
.mainNavi .close span{
	position:absolute;
	left:0;
	right: 0;
	margin: 0 auto;
	width:40%;
	top: 50%;
	height:1px;
	opacity: 1;
	background-color:#FFF;
	z-index: 20;
}
.mainNavi .close span:nth-of-type(1){
	-webkit-transform:rotate(45deg);
	transform:rotate(45deg);
}
.mainNavi .close span:nth-of-type(2){
	-webkit-transform:rotate(-45deg);
	transform:rotate(-45deg);
}

.mainNavi .element{
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	overflow: auto;
}

.mainNavi h3{
	width: 11.5em;
	margin: 6em auto 0;
}
.mainNavi h4{
	width: 9.5em;
	margin: 5em auto 2.5em;
}

.mainNavi .naviList{
	width: 83%;
	margin: 0 auto;
}
.mainNavi .naviList ul{
	width: 100%;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	grid-row-gap: 1.5em;
}
.mainNavi .naviList li{width: 28.5%;}


.mainNavi .naviList  span,
.mainNavi .naviSingle  span{
	display: block;
	font-family: futura-pt, sans-serif;
	font-weight: 500;
	letter-spacing: 0.05em;
	font-size: 1.05em;
	text-align: center;
	margin-top: 0.8em;
}

.mainNavi .naviSingle{
	width: 21em;
	margin: 0 auto;
} 

.mainNavi .online{
	width: 75%;
	margin: 5em auto 8em;
}
.mainNavi .online a{
	width: 100%;
	display: block;
	background: #053251;
	border-radius: 10em;
}




/*----------*/

.lead{
	width: 100%;
	margin: 0 auto;
	padding: 3em 0 6em;
	background: #FFF;
}
.lead .inner{width: 100%;max-width: 1600px;margin: 0 auto;}

.lead .copy{
	width: 46%;
	margin: 0 auto;
	line-height: 1.8;
	text-align: justify;
	font-size: 0.95em;
	text-justify: inter-ideograph;
}
.lead .menu{
	width: 32%;
	margin: 4em auto 0;
}
.lead .menu ul{
	display: flex;
	justify-content: space-between;
}
.lead .menu ul li{width: 27%;}

.lead .menu h2{width: 3.5em;margin: 0 auto 1.5em;}
.lead .menu h3{margin: 1em auto 0;}
.lead .menu .m01 h3{width: 2.5em;}
.lead .menu .m02 h3{width: 6.4em;}
.lead .menu .m03 h3{width: 2.5em;}

@media(min-width:769px) {
.lead .menu a h3{
	position: relative;
	display: block;
	top:0;
	-webkit-transition: top 0.3s;
	transition: top 0.3s;
}
.lead .menu .m03 a:hover{bottom: 10px;}

.lead .menu a figure{-webkit-transition: opacity 0.4s;transition: opacity 0.4s;}
.lead .menu a:hover figure{opacity: 0.6;}
.lead .menu a:hover h3{top: 0.3em;}
}

/*----------*/


.category{
	width: 100%;
	position: relative;
	margin: 0 auto;
}
.category.cateKIDS{padding-top: 7em;background: #FFF;}


.category.cateKIDS .categoryTitle{width: 30em;margin: 0 auto;}

.category.cateKIDSBABY{background: linear-gradient(180deg, rgba(229,249,249,0) 0%, rgba(229,249,249,0) 50%, #fffad2 50%, #fffad2 100%);}
.category.cateKIDSBABY .categoryTitle{
	position: absolute;
	top: 1em;
	right: 21em;
	width: 22em;
}

.category.cateBABY{padding-top: 7em; background: #fffad2;}
.category.cateBABY .categoryTitle{width: 30em;margin: 0 auto;position: relative; z-index: 5;}


/*----------*/


.lookSet{
	width: 100%;
	position: relative;
	max-width: 1600px;
	padding: 6em 0;
	margin: 0 auto;
}
.lookSet.no01{padding-top: 4em;}
/*.lookSet.no09{padding-bottom: 22em;}*/
.lookSet.no09{padding-bottom: 18em;}
.lookSet.no10{padding-top: 0;max-width: none;}
.lookSet.no11{padding-top:0;margin-top: -1.5em;}
.lookSet.no14{padding-bottom: 14em;}


/*---*/

.lookSet .mainImage{position: relative;line-height: 1;}

.lookSet .mainImage{margin: 0 auto;width: 46.8%;}
.lookSet.no03 .mainImage{width: 52.6%;}
.lookSet.no04 .mainImage{width: 93.75%;}
.lookSet.no04 .horizontal-wrapper{display: none;}
.lookSet.no06 .mainImage{width: 48%;}
.lookSet.no07 .mainImage{width: 36%;}
.lookSet.no08 .mainImage{width: 50%;}
.lookSet.no10 .mainImage{width: 100%;}



.lookSet .number{
	position: absolute;
	z-index: 5;
	font-size: 2.1em;
	font-family: futura-pt, sans-serif;
	font-weight: 500;
	letter-spacing: 0.05em;
}
.lookSet .number em{
	position: relative;
	font-size: 0.85em;
	top: -0.28em;
}


.lookSet.no01 .mainImage .number{top: 1em;left: 1.2em;}
.lookSet.no02 .mainImage .number{top: -0.4em;left: 1em;}
.lookSet.no03 .mainImage .number{top: 0em;left: 2.2em;}
.lookSet.no04 .mainImage .number{top: 1.5em;right: 1em;}
.lookSet.no05 .mainImage .number{top: 1em;right: 1em;}
.lookSet.no06 .mainImage .number{top: 13em;left:1.4em;}
.lookSet.no07 .mainImage .number{top: 1.3em;left: -1.1em;}
.lookSet.no08 .mainImage .number{top: 1.3em;left: 1.4em;}
.lookSet.no09 .mainImage .number{top: 1.8em;left: 1.2em;}
.lookSet.no10 .mainImage .number{top: 7em;left: 2em;}
.lookSet.no11 .mainImage .number{top: 1.8em;left: 1.2em;letter-spacing: 0.02em;}
.lookSet.no12 .mainImage .number{top: 1.5em;right: 1.1em;letter-spacing: 0.02em;}
.lookSet.no13 .mainImage .number{top: 1.8em;left: 1.2em;letter-spacing: 0.02em;color: #7bc6ba;}
.lookSet.no14 .mainImage .number{top: 1.6em;left: 1.1em;letter-spacing: 0.02em;}




.lookSet.no03 .mainImage .photo{
	border-radius: 50%;
	overflow: hidden;
	padding-top: 2em;
}
.lookSet.no03 .mainImage .photo img{
	border-radius: 50%;
	overflow: hidden;
}


/*---*/

.lookSet .subImage{
	width: 68.75%;
	margin: 6em auto 0;
	position: relative;
}
.lookSet .subImage.column{
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.lookSet .subImage figure{margin: 0 auto;position: relative;}


.lookSet.no01 .subImage .sub01{width: 36.8%;margin: 0;}
.lookSet.no01 .subImage .sub02{width: 50%;margin: 0;}

.lookSet.no02 .subImage .sub01{width: 49%;}

.lookSet.no03 .subImage .sub01{width: 61.3%;}

.lookSet.no04 .subImage.column{align-items: flex-start;width: 71.8%;padding-bottom: 1.5em;}
.lookSet.no04 .subImage .sub01{width:38.9%;margin: 0;}
.lookSet.no04 .subImage .sub02{width:47.5%;margin: 0;margin-top: 6em;}

/*.lookSet.no04 .subImage .sub03{width:49.5%;margin: 0;}*/
.lookSet.no04 .subImage .sub04{width:60%}

.lookSet.no05 .subImage .sub01{width:36%;margin-left: 57.7%;}
.lookSet.no05 .subImage .sub02{width:52.5%;margin: 6em auto 0;overflow: hidden;}
.lookSet.no05 .subImage .sub02 .cover{position: absolute;left: 0;bottom: 0;z-index: 20;width: 100%;}
.lookSet.no05 .subImage .sub03{position: absolute;width: 39%;top: 18%;left: 10%;}

.lookSet.no06 .subImage .sub01{width: 52%;}

.lookSet.no07 .subImage{align-items:flex-start;}
.lookSet.no07 .subImage .sub01{width: 40%;margin-left:6%;margin-top: 10%;}
.lookSet.no07 .subImage .sub02{width: 33%;margin-right:6%;}
.lookSet.no07 .subImage .sub03{width: 68%;}

.lookSet.no08 .subImage .sub01{width: 35%;margin: 0 auto;}
.lookSet.no08 .subImage .sub02{width: 37.5%;margin-left:2%;}
.lookSet.no08 .subImage .sub03{width: 49%;margin: 0;}

.lookSet.no09 .subImage.farst{margin-top: -4em;}
.lookSet.no09 .subImage.column{margin-top: 4em;}
.lookSet.no09 .subImage .sub01{width: 42.4%;margin-left: 15%;}
.lookSet.no09 .subImage .sub02 img{position: relative;z-index: 5;width: 115%;}
.lookSet.no09 .subImage .sub03 img{position: relative;z-index: 2;width: 115%;left: -13%;}
.lookSet.no09 .subImage.leftIn{
	position: relative;
	left: -80vw;
	-webkit-transition: left 1.4s cubic-bezier(0.33, 1, 0.68, 1);
	transition: left 1.4s cubic-bezier(0.33, 1, 0.68, 1);
}
.lookSet.no09 .subImage.leftIn.view{left: 0vw;}




.lookSet.no11 .subImage .sub01{width: 28.8%;margin-left:3%;}
.lookSet.no11 .subImage .sub02{width: 52.3%;margin-right:3%;}

.lookSet.no13 .subImage{justify-content: center;flex-wrap: wrap;gap:0.5em;margin-top: 8em;padding: 0 10%;}
.lookSet.no13 .subImage figure{width: 40%;margin:0;}
.lookSet.no13 .subImage .sub02 img{-webkit-transform:rotate(-1.3deg);transform:rotate(-1.3deg);}
.lookSet.no13 .subImage .sub03 img{-webkit-transform:rotate(1.3deg);transform:rotate(1.3deg);}

.lookSet.no14 .subImage .sub01{width: 37.6%;margin-left:3%;}
.lookSet.no14 .subImage .sub02{width: 48.5%;margin-right:-2%;}

.lookSet .fade-wrap{display: none;}

.lookSet .subImage .attention{
	position: absolute;
	left: 0;
	bottom: -2.8em;
	font-size: 0.65em;
}

/*-------*/
.lookSet .deco.abso{position: absolute;}

.lookSet.no02 .deco{top: -2.2%;right:13%;width: 36%;}

.fish-rail{
	position:absolute;
	bottom: 0%;
	left: -5%;
	right: -5%;
	overflow: visible;
}
.fish-rail .fish{
	position: absolute;
	right: 0;
	bottom: 0;
	width: 17%; 
	height: auto;
	transform-origin: center center;
	animation:
		fish-move 25s linear infinite,
		fish-float 3s ease-in-out infinite;
}
@keyframes fish-move{
  0%   { transform: translateX(0) scaleX(1); }
  49%  { transform: translateX(calc(-300%)) scaleX(1); }
  50%  { transform: translateX(calc(-300%)) scaleX(-1); }
  100% { transform: translateX(0) scaleX(-1); }
}
@keyframes fish-float{
  0%   { translate: 0 0; rotate: -3deg;}
  50%  { translate: 0 -5%; rotate:  4deg;}
  100% { translate: 0 0; rotate: -3deg;}
}
.fish-rail .fish .bubble{
	position: absolute;
	width: 28%;
	left: -5%;
	bottom: 60%;
	opacity: 0;
	pointer-events: none;
	animation: bubble-up 10s ease-in-out infinite;
	transform-origin: center bottom;
}
.fish-rail .fish .bubble.b01{ animation-delay: 0s;}
.fish-rail .fish .bubble.b02{ animation-delay: 0.5s;}
.fish-rail .fish .bubble.b03{ animation-delay: 1.0s;}
@keyframes bubble-up{
  0%   { transform: translateY(0) scale(.5); opacity:0; }
  50%   { transform: translateY(0) scale(.5); opacity:0; }
  70%  { transform: translateY(-30px) scale(1); opacity:1; }
  100% { transform: translateY(-50px) scale(1.2); opacity:0; }
}

.lookSet.no05 .deco.d01{top: -13%;right:2%;width: 35%;}
.lookSet.no05 .deco.d02{top: -4%;left:14%;width: 11%;}
.lookSet.no05 .deco.d03{
	position: absolute;
	right: 8%;
	bottom:0%;
	width: 28%;
	animation: fish05 6s ease-in-out infinite normal;
}
@keyframes fish05 {
0% {transform: translateY(0%);}
20% {transform: translateY(-30%);}
60% {transform: translateY(-30%);}
80% {transform: translateY(0%);}
100% {transform: translateY(0%);}
}


.lookSet.no07 .deco{top: -10.5%;right:4%;width: 25%;}

.lookSet.no08 .deco.d01{bottom: -6%;left:8.5%;width: 17%;}
.lookSet.no08 .decoSet{
	position: absolute;
	top: -40%;
	right: 0;
	z-index: 50;
	width: 100%;
}
.lookSet.no08 .d02{top: 0;right:15%;width: 7%;}
.lookSet.no08 .d03{top: 1.5em;right:5.5%;width: 10%;}
.lookSet.no08 .d04{top: 6em;right:11%;width: 10%;}
.lookSet.no08 .d05{bottom: -13%;left:8%;width: 13%;}
.lookSet.no09 .deco{top: 21%;right:-6%;width: 27%;}
.lookSet.no10 .deco.d01{top: 28.5%;left:28.5%;width:7.5%;}
.lookSet.no10 .deco.d02{top: 34%;right:28.5%;width:7.7%;}
.lookSet.no11 .decoSet{width: 12%;margin: 9em auto 0;}

.lookSet.no11 .decoSet{animation: floating-x 5s ease-in-out infinite alternate-reverse;}
.lookSet.no11 .decoSet img {animation: floating-y 2s ease-in-out infinite alternate-reverse;}
@keyframes floating-x {
0% {transform: translateX(-7%);}
100% {transform: translateX(7%);}
}
@keyframes floating-y {
0% {transform: translateY(-8%);}
100% {transform: translateY(8%);}
}

.lookSet.no13 .deco.d01{top:14%;right:15%;width:19%;}
.lookSet.no13 .deco.d02{bottom: -11%;right:7%;width:25.5%;}
.lookSet.no13 .deco.d02{animation: yurayura 4s ease-in-out infinite alternate-reverse;}
@keyframes yurayura {
0% {transform:rotate(-9deg) translateX(-8%);}
100% {transform: rotate(9deg) translateX(8%);}
}





.show .pon{
	-webkit-transform: scale(0);
    transform: scale(0);
	-webkit-transition: all 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
	transition: all 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.show.view .pon{-webkit-transform: scale(1);transform: scale(1);}

.show .peta{
	-webkit-transform: scale(1.6);
    transform: scale(1.6);
	opacity: 0;
	-webkit-transition: all 0.8s cubic-bezier(0.34, 1.56, 0.64, 1);
	transition: all 0.8s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.show.view .peta{-webkit-transform: scale(1);transform: scale(1);opacity: 1;}

.show .delay1{-webkit-transition-delay:0.4s;transition-delay:0.4s;}
.show .delay2{-webkit-transition-delay:0.8s;transition-delay:0.8s;}
.show .delay3{-webkit-transition-delay:1.2s;transition-delay:1.2s;}

.posiLB{-webkit-transform-origin: bottom left;transform-origin: bottom left;}




/*-------*/



.lookSet .itemTrigger{
	display: flex;
	justify-content: center;
	column-gap: 1em;
	margin-top: 5em;
}

.lookSet .itemTrigger .button{
	width: 9em;
}
.lookSet .itemTrigger .button a{
	display: flex;
	justify-content: center;
	color: #FFF;
	font-family: futura-pt, sans-serif;
	font-weight: 500;
	font-size: 1.14em;
	letter-spacing: 0.05em;
	padding: 0.42em 0;
	text-align: center;
	border-radius: 3em;
	border: 1px solid;
	cursor: pointer;
}

.lookSet .itemTrigger .button.girl a{background: #e2d103;border-color: #e2d103;}
.lookSet .itemTrigger .button.boy a{background: #053251;border-color: #053251;}
.lookSet .itemTrigger .button.baby a{background: #7bc6ba;border-color: #7bc6ba;}

.lookSet .itemTrigger .button a span{
	position: relative;
	display: block;
	width: 0.7em;
	height: 0.7em;
	margin: 0.1em 0 0 0.2em;
}

.lookSet .itemTrigger .button a span::before,
.lookSet .itemTrigger .button a span::after{
	content: '';
	position: absolute;
	top: 50%;
	left: 0;
	height: 1px;
	width: 100%;
	background: #FFF;
}
.lookSet .itemTrigger .button a span::after{
	-webkit-transform:rotate(90deg);transform:rotate(90deg);
}


@media(min-width:769px) {
.lookSet .itemTrigger .button a{-webkit-transition: color 0.4s, background 0.4s;transition: color 0.4s, background 0.4s;}
.lookSet .itemTrigger .button.girl a:hover{background:rgba(226,209,3,0);color: #e2d103;}
.lookSet .itemTrigger .button.boy a:hover{background:rgba(5,50,81,0);color: #053251;}
.lookSet .itemTrigger .button.baby a:hover{background:rgba(129,198,186,0);color: #7bc6ba;}

.lookSet .itemTrigger .button a span::before,
.lookSet .itemTrigger .button a span::after{-webkit-transition:background 0.4s;transition:background 0.4s;}
.lookSet .itemTrigger .button.girl a:hover span::before,
.lookSet .itemTrigger .button.girl a:hover span::after{background: #e2d103;}
.lookSet .itemTrigger .button.boy a:hover span::before,
.lookSet .itemTrigger .button.boy a:hover span::after{background: #053251;}
.lookSet .itemTrigger .button.baby a:hover span::before,
.lookSet .itemTrigger .button.baby a:hover span::after{background: #7bc6ba;}
}







/*--------------------------------------*/


.footer{
	width: 100%;
	height: 100%;
	background: url("../images/footer_bk.webp") center center;
	background-size: cover;
	text-align: center;
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	color: #FFF;
	min-height: 48em;
}

.footer .element{padding-bottom: 1.5em;}

.footer h2{
	width: 12.5em;
	margin: 0 auto;
}

.footer .credit{
	font-family: futura-pt, sans-serif;
	font-weight: 500;
	letter-spacing: 0.02em;
	line-height: 1.5;
	margin: 4em 0;
	font-size: 0.95em;
}

.footer .sns{
	width: 100%;
	display: flex;
	justify-content: center;
	gap:1em;
}
.footer .sns a{
	display: block;
	width: 3.7em;
	height: 3.7em;
	border: 1px solid #FFF;
	border-radius: 50%;
}
.footer .sns a span{
	display: block;
	padding: 28%;
}
.footer .copyright{
	position: absolute;
	bottom: 3em;
	left: 0;
	right: 0;
	font-family: futura-pt, sans-serif;
	font-weight: 500;
	letter-spacing: 0.02em;
	font-size: 0.82em;
}









/*++++++++++++++++++++++++++++++++++++++++++++*/


.modal{
	width: 80%;
	max-width: 440px;
	display: none;
	position: relative;
	font-size: 15px;
	color: #000;
}
.modal .number{
	font-family: futura-pt, sans-serif;
	font-weight: 500;
	text-align: center;
	font-size: 0.86em;
}
.modal.boy .number{color: #053251;}
.modal.girl .number{color: #e2d103;}
.modal.baby .number{color: #7bc6ba;}

.modal .gender{
	width: 7.5em;
	margin:0.5em auto 0.8em;
}
.modal .itemList{
	width: 100%;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	max-height: calc(90vh - 10em);
}

/*------------------------*/
@-moz-document url-prefix() {
  .popup-inner {
    scrollbar-width: thin;
    scrollbar-color: rgba(0,0,0,0.4) transparent;
  }
}
@media(min-width:769px) {
.popup-inner::-webkit-scrollbar { width: 5px;}
.popup-inner::-webkit-scrollbar-track {background-color: #FFF;}
.popup-inner::-webkit-scrollbar-thumb {background-color: rgba(0,0,0,0.2);border-radius: 2px;}
.popup-inner::-webkit-scrollbar-thumb:hover {background-color: rgba(0,0,0,0.3);}
}


.modal .itemBox{
	width: 88%;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	align-items: center;
	border-top: 1px solid #F2F2F2;
	font-family: nimbus-sans, sans-serif;
	font-weight: 400;
	font-style: normal;
}
.modal .itemBox:first-child{border: none;}
.modal .itemBox figure{
	width: 33%;
	padding: 1em 0;
}

.modal .itemBox .spec{width: 60%;}



.modal .itemBox .spec .category{font-weight: 700;}
.modal .itemBox .spec .name{margin-top: 0.3em;}
.modal .itemBox .spec .size{color: #999;margin-top: 0.3em;font-size: 0.98em;}
.modal .itemBox .spec .price{
	margin-top: 0.8em;
	display: flex;
	justify-content: space-between;
}
.modal .itemBox .spec .price a{
	color: #FFF;
	font-size: 0.9em;
	line-height: 1;
	padding: 0.3em 0.6em 0.2em;
}
.modal.boy .itemBox .spec .price a{background: #053251;}
.modal.girl .itemBox .spec .price a{background: #e2d103;}
.modal.baby .itemBox .spec .price a{background: #7bc6ba;}


/*-----*/


.fancybox-content {
  max-height: 90vh;
  overflow: visible;
  /*overflow: hidden;*/
  border-radius: 20px;
  padding: 0;
  padding: 40px 0;
}


.fancybox-bg {background: #000;}
.fancybox-is-open .fancybox-bg {opacity: 0.65;}



.fancybox-close-small{
	width: 50px;
	height: 50px;
	opacity: 1;
	border-radius: 50%;
	right: -18px !important;
	top: -18px !important;
}


.modal.boy .fancybox-close-small{background: #053251;}
.modal.girl .fancybox-close-small{background: #e2d103;}
.modal.baby .fancybox-close-small{background: #7bc6ba;}

.fancybox-close-small svg{display: none;}

.fancybox-close-small::before,
.fancybox-close-small::after{
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 40%;
	margin-left: -20%;
	height: 1px;
	background: #FFF;
	-webkit-transform:rotate(45deg);
	transform:rotate(45deg);
}
.fancybox-close-small::after{
	-webkit-transform:rotate(-45deg);
	transform:rotate(-45deg);
}


.fancybox-can-swipe .fancybox-content,
.fancybox-can-pan .fancybox-content {cursor:auto;}


.fancybox-navigation .fancybox-button--arrow_left{display: none;}
.fancybox-navigation .fancybox-button--arrow_right{display: none;}

/*++++++++++++++++++++++++++++++++++++++++++++*/

















