@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Kaisei+Opti&family=Noto+Sans+JP:wght@400;500&family=Yusei+Magic&family=Zen+Kurenaido&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;
	
}



/*----------------------------------------------------------------------------------
use color
red:#ce3a4c;
gold:#cda976;
yellow:#e1d388;
green:#018176;
nevy:#1e5778;
pink:#e464a5;
----------------------------------------------------------------------------------------*/
body{background-color:#1e5778;}
#container{
	position:relative;
	width: 100%;
	margin: 0 auto;
	text-align: center;
	font-family: 'Noto Sans JP', sans-serif;
	overflow: hidden;
}
#container2{max-width: 700px;margin: 0 auto;
	text-align: center;overflow: hidden;}
section{padding: 0 5%;}
.bt{
	margin: 0 auto;
	text-align: center;
	background-color: #018176;
	width:70%;/**/
	padding: 10px 0;
	border-radius: 30px;
}
.bt a{color:#fff;}
.bt2{margin: 0 auto;
	text-align: center;
	background-color: #cda976;
	width:85%;/**/
	padding: 10px 0;
	border-radius: 30px;}




#top{position: relative;}
.mainVisual{
	position: relative;
	display: flex;
	flex-wrap: wrap;
	width:100%;
	background-color: #ce3a4c;
	padding-bottom: 20px;
	
}
.colorbox{
	flex-basis: 50%;
	position: relative;
}
.rd{background-color:#ce3a4c;}
.gd{background-color:#cda976;margin: 0;padding: 0;}
.yl{background-color:#e1d388;}
.gn{background-color:#018176;}
.pk{background-color:#e464a5;}
.mainImg{	
	position: relative;
}
.icon{position: absolute;width: 15%;}
.lg1{top:5%;left: 5%;width: 10%;}
.lg2{top:0px;left: 24%;width: 6%;}
.lg3{top:20%;left: 17%;width: 10%;}
.deer_gb{top:60%;right: 20%;}
.snow{top:5%;left:10%;}
.treen_yl{top:40%;left:25%;}
.Tttl{width: 44%; position: absolute;top:50%;left:20%;}
.Logo{width: 20%; position: absolute;top:0;right: 0;}
.main{background-color:#1e5778; }
.text{font-size: 1.1rem;
	padding: 30px 20px;
	text-align: center;
	color:#fff;line-height: 2;
}
.text h1{font-size: 1.6rem;font-family:  'Kaisei Opti', serif; font-weight: 600;letter-spacing: 0.1rem;line-height: 1;}
.en{font-weight: 400;font-size: .9rem;letter-spacing: 0.35rem;}
a{text-decoration: none; color: #333;}
.g1{line-height: 1.8;}
.space{height: 50px;}
.ttl_osusume{padding: 50px 0;}
.ttl_osusume p span{
  position: relative;
  background: linear-gradient(transparent 60%, #ce3a4c 60%);
	padding: 0 15px;
}
.ttl_osusume p{
	font-family:  'Kaisei Opti', serif;
	font-size: 2rem; 
	color:#fff;
	
}

#lineup{
	margin: 0 auto;
	text-align: center;
	width: 80%;
	
}
.ttl_lineup{font-size: 2rem;color:#ce3a4c;width: 60%;padding-left: 20%;font-weight: 700;}
.lineup_item{
	display: flex; 
	align-items: center;/**/
	width: 80%;
	height: 7rem;/**/
	margin: 30px 10%;
	font-weight: 700;border-radius: 30px;
}
.lineup_img{flex-basis: 30%;margin: 0;padding: 0;height: 7rem;}
.lineup_img1{background-image:url("../img/lineUp1.png");
	background-size: cover;
	border-bottom-left-radius: 30px;
	border-top-left-radius: 30px;
}
.lineup_img2{background-image:url("../img/lineUp2.png");
	background-size: cover;
	border-bottom-left-radius: 30px;
	border-top-left-radius: 30px;
}
.lineup_img3{background-image:url("../img/lineUp3.png");
	background-size: cover;
	border-bottom-left-radius: 30px;
	border-top-left-radius: 30px;
}

.btn{flex-basis: 60%;margin: 0;font-family: 'Kaisei Opti', serif; font-size: 1.1rem;padding-left: 2%;/*background-color: red;*/}
.btn a{color:#fff;text-decoration:none;}
.rd{background-color:#ce3a4c;}
.gn{background-color:#018176;}
.yl{background-color:#e1d388;}
.icon_down{padding-left: 20px;}
.icon-color{color: #018176;}
.icon-color2{color: #cda976;}
.icon-color3{color:#fff;}
.space_icon{padding: 25px 0;}
#princess{
	background-color: #ce3a4c;
	position: relative;
	margin-top: 60px;
	border-radius: 30px;
}
.stars2{top:20%;right: 8%;}
.stars3{bottom:0;left: 20%;}
.stars4{bottom:-10%;left: 35%;width:10%; }
.stars4_1{top:38%;right: 4%;}

.stars5{top:20%;left: 12%;width:18%; }
.present1{bottom:-10%;right:10%;}
.present2{bottom:-25%;right:20%;transform: rotate(15deg);}

.ttl{width: 80%;margin-left: 10%; top:-60px;position: absolute;}
.view{position: relative;padding-top: 160px;}
.view_tz{padding-top: 60px;}
.item{width: 70%;}
.card{position:absolute; 
	right: 0%;
	top:65%;
	/*transform: rotate(-7deg);*/
	background-image:url("../img/card_1.png");
	background-size: cover;
}
.card_text {
	width: 220px;
	height:220px;
	display: table-cell;
  vertical-align: middle;
   text-align: left;
	padding: 30px;
	
	font-family: 'Zen Kurenaido', sans-serif;
	font-weight: 600;
	font-size: 1.1rem;
	line-height: 1.5;
	color:#333;
}
.item_rt{padding-left: 30%;}
.card_rt{
	position:absolute; 
	left: 0%;
	top:60%;
	background-image:url("../img/card_1.png");
	background-size: cover;
}
.space2{margin-top: 200px;}
.ttl_hr{width: 60%;padding-left: 20%;}
#princess .g1 a{color:#fff;}
.g1{padding: 20px 0;}
.goods_item{display: flex;flex-wrap: wrap;}
.gd_it{flex-basis: 25%;}
.gd_it2{flex-basis: 30%;padding: 0 1.6%;}
#lol{background-color: #e464a5;
	position: relative;
	margin-top: 60px;
	border-radius: 30px;
	border: solid #000 5px;
	padding: 0;
	
}
.ttl_lol{width: 60% ;margin-left:35%; margin-right: 5%;}
.view2{padding-top: 30px;position: relative;padding-left: 10%; padding-right: 10%;}


.view{position: relative;}

#lol .card_rt{ 
	left: 2%;
	top:80%;
	
	}
.view3{position: relative;}
.ck{position:absolute;transform: rotate(-15deg);top:-20%;width: 110%;left: -30px;}
.view3_socks{ position: relative; width: 60%;}
#lol .card{
	right: 10%;
	top:50%;
	
}
#lol .view3 .card_text{width: 200px; height:200px; padding: 10px;;}
.character{
	position: absolute;
	width: 25%;
	top:-5%;
	right: 10%;
	transform: rotate(5deg);	
}
.stars9{top:-25%;right: 0%;}
.tree{top:0%;right:30%;}

.stars6{top:4%;left:15%;}
.stars7{top:8%;left:25%;}
.stars8{top:42%;right:4%;}
.stars8s{top:50%;right:0%;}
.snowman{top:10%;right:6%;}

.goods2{display: flex;flex-wrap: wrap;}
.goods_item3{flex-basis: 45%;padding: 30px 2.5%;}
#cars{
	position: relative;
	background-color: #e1d388;
	border-radius: 30px;}
#cars .ttl{width: 50%;position: absolute;top:-35px;left:-50px;;}
#cars .card{
	top:70%;}
#cars .card_rt{top:69%;left:1%;}
#cars 
#cars .view{padding-top: 50px;}
#cars .item_rt{padding-top: 100px;}
.stars_w{top:10%;right:10%; }
.surgerman{top:45%;right:11%;}
.stars_w2{top:10%;right:5%; }
.snow2{top:50%;left:5%;}
/*-----------------------site-header---------------------*/
.site-header{

    display: none;
 
    position: absolute;

	z-index: 99999;
   /*font-family:  'Kaisei Opti', serif; */
}
.gnav__menu{
	width: 100%;
	justify-content: space-between;
	align-items: center;
	
}
.gnav__menu__item{
	
	padding: 20px 10px;/**/
	list-style: none; 
	
}
.gnav__menu__item a{color:#fff;}

.site-header.show{
	 display:flex;
    position: fixed;
    bottom: 0;
	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;
		
	}
	section{padding: 0;}
	.view{padding-top: 130px;}
	.view_tz{}
	.item{width: 80%;}
	.item_rt{padding-left:20%; width: 80%;} 
	.card{right: 2%;top:85%;}
	.card_rt{left: 2%;top:85%;}
    .card_text {
		display: table-cell;
        vertical-align: middle;
	    width: 180px;
	    height:180px;
		padding: 40px 30px 30px 40px;
	}
	#lineup{width: 100%;}
	.view2{padding-left: 0;padding-right: 0;}
	
.view2_socks{margin-top: -50px;width: 60%; padding-left: 40%;}
	
	.snowman{top:4%;right:6%;}
	#cars .view{padding-top:50px; }
	#cars .item_rt{padding-top: 100px;}
	#cars .card{}
	#cars .card_text{
		width: 200px;
	    height:200px;
		padding-top: 40px;
		
	}
	.goods_tz{padding: 0;}
	.bt{width: 85%;}
	.character{right:1%;}
	#lol .card{right:1%;}
	#lol .view2 .card_text{
		width: 190px;
	    height:190px;
		padding: 20px;
		}
	#lol .card .card_text{width: 150px; height: 150px;padding-top: 23px;padding-left: 25px;
		padding-right:0;padding-bottom: 23px; }
	
	.gnav__menu{
		display: flex;
		width:98vw;
	}

	.gnav__menu__item{
		height: 30px;
		width: 25%;
		padding:  15px;/*0px*/
		margin: 0;
	font-size: .8rem;
		box-shadow: 0 0 2px #333;
		
	}
	.site-header{padding: 1vw;}
	.icon_down{display: none;}/**/
	
	
	
}








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

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

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


/*--------------------------------------------star-----------------------------------------*/
/*#Allst{position: fixed;top:500px;}*/