/*@import url('https://fonts.googleapis.com/css2?family=Shippori+Mincho+B1:wght@400;600&display=swap');*/
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200;300;400&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Kiwi+Maru:wght@300;400;500&display=swap');
.anim1:before, .anim1:after{
     opacity: 0;
     transform: translateY(100px);
     transition: 0.5s;
     transition-property: opacity,transform
}
.anim1.fadetrans:before, .anim1.fadetrans:after, #top_cms.fadetrans:before, #top_cms.fadetrans:after{
     opacity: 1;
     transform: none
}

.con3_wrap.fadetrans:after {/*むりくり*/
	opacity: 0;
	transform: translateY(100px);
	transition: 0.7s;
}
.con3_wrap:after {/*むりくり*/
opacity: 0;	
}
.con3_wrap.fadetrans:after {
opacity: 0;	
}
.con3_wrap.fadetrans2:after {
	opacity: 1;
	transform: none
}
#header:after{
     opacity: 0;
     transform: translateY(200px);
     transition: .5s;
     transition-property: opacity,transform
}
#header.fadetrans:after {
     opacity: 1;
     transform: none;
	width: 600px;
    height: 600px;
}
#header {
	position: relative;
}
#header:after {
position: absolute;
    content: "";
    display: block;
    background-color: rgba(255, 127, 80, 0);
    background-image: -webkit-radial-gradient(#fff 25%, rgba(255, 127, 80, 0) 50%);
    background-image: radial-gradient(#ffffff 48%, rgba(255, 127, 80, 0) 70%);
    width: 400px;
    height: 400px;
    z-index: -1;
    top: -88px;
    left: -52px;
}
.con3_wrap {
	position: relative;
}
.con3_wrap:before {
    position: absolute;
    content: "";
    display: block;
    background-color: rgba(255, 127, 80, 0);
    background-image: -webkit-radial-gradient(#ffeabe 25%, rgba(255, 127, 80, 0) 50%);
    background-image: radial-gradient(#feeddb 11%, #ffa783 58%, rgba(255, 127, 80, 0) 73%);
    width: 100px;
    height: 100px;
    z-index: 0;
    top: 2%;
    right: 12%;
}
.con3_wrap:after {
    position: absolute;
    content: "";
    display: block;
    background-color: rgba(255, 127, 80, 0);
    background-image: -webkit-radial-gradient(#ffeabe 25%, rgba(255, 127, 80, 0) 50%);
    background-image: radial-gradient(#ffeabe 6%, #ffa07a 58%, rgba(255, 127, 80, 0) 72%);
    width: 78px;
    height: 78px;
    z-index: 1;
    top: 130px;
    right: 0%;
}






/* ---------------------------------- */
#main_img .catch {
    bottom: 10%;
    right: 0%;
    z-index: 10;
    width: 600px;
    font-size: 39px;
    color: #fff;
filter: drop-shadow(0px 0px 5px rgba(0,0,0,0.4));
}
header .menu_stick {
    border-radius: 0px 0 0 25px;
}
body {
	font-size: 16px;
font-family: 'Kiwi Maru', serif;
}
h2, h3, h4 {
font-family: 'Kiwi Maru', serif;
}

#contents1 h2 {
    position: relative;
    padding: 0.5rem 1rem 1rem;

}
#contents2 h2 {
    position: relative;
}
#contents1 h2:after {
    position: absolute;
    bottom: 10px;
    left: 0;
    right: 0;
    margin: auto;
    width: 0%;
    height: 4px;
    content: '';
    background-color: #fc7e4f;
    background-size: 7px 7px;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
.JS_ScrollAnimationItem {
    position: relative;
    z-index: 1;
    display: inline-block;
}
.JS_ScrollAnimationItem.isActive:after, #contents1 h2.isActive:after {
    width: 100%;
}
.JS_ScrollAnimationItem:after {
    content: '';
    position: absolute;
    left: 0;
    bottom: -9px;
    width: 0%;
    height: 4px;
    background: #ffffff;
    z-index: -1;
    transition: all 1.2s;
}




#contents1 .con1_right {
	background: #ffeddb;z-index: 1;
}
#contents1 .con1_left {
background-position: 21% center;
}
#contents1 {
	position: relative;
}
#contents2 .con2_wrap {
	z-index: 1;position: relative;
}
#contents2 .con2_wrap:before {
    position: absolute;
    top: 0%;
    left: 12%;
    content: "";
    display: block;
    background-color: rgba(255,255, 255, 0);
    background-image: radial-gradient(#ffebc0 21%, rgba(255, 255, 255, 0) 69%, rgb(255 255 255 / 0%) 80%);
    width: 300px;
    height: 300px;
    z-index: -1;
}
#footer .footer_bottom {
    background-color: #ffffff;
}
.footer_nav {
	background: #fff;
}
.shopBnr {
	bottom: -33px;
    right: 20px;
	z-index: 10;
	transition: all 0.1s;
}



main .banner a:hover, .bannerWrap a:hover img {
    transform:scale(1.05)
}
.background {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -1;
    overflow: hidden;
    transition: background-color 1s;
background-color: #ffeddb;
}

.background::before {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 100%;
    content: "";
/*    background-image: linear-gradient(
80deg
,rgba(255,255,255,0) 0,#fff 16.5%,rgba(255,255,255,0) 33%,#fff 49.5%,rgba(255,255,255,0) 66%,#fff 82.5%,rgba(255,255,255,0) 100%);*/
	background-image: linear-gradient(
80deg
,rgb(255 244 233 / 0%) 0,#ffeddb 16.5%,rgb(255 243 231 / 0%) 33%,#fff0e100 49.5%,rgb(255 246 237) 66%,#fff0 82.5%,rgb(255 242 228) 100%);
    background-size: 200% 100%;
    transition: opacity .4s;
    -webkit-animation-name: shift;
    animation-name: shift;
    -webkit-animation-duration: 5s;
    animation-duration: 20s;/**/
    -webkit-animation-timing-function: cubic-bezier(.445,.05,.55,.95);
    animation-timing-function: cubic-bezier(.445,.05,.55,.95);
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-direction: alternate;
    animation-direction: alternate;
}




@-webkit-keyframes shift {
  0% {
    background-position: 100% 0
  }
}
@keyframes shift {
  0% {
    background-position: 100% 0
  }
}



.fadeinImg{
     opacity: 0;/*
     transform: translateY(20px);*/
     transition: 5.5s;
     transition-property: opacity,transform
}
.fadeinImg.fadetrans{
     opacity: 1;
     transform: none
}
.trans_header .banner {
	right: 80px;
}
.trans_header .banner a {
	height: 80px;
}

#cms_2-a figure {
	margin: 0 auto 30px;
}
#cms_2-a figure img {
	box-shadow: none;
}
#cms_3-d .cate_title {
    border-left: 0;
    border-top: 0;
    display: block;
    text-align: center;
    background-color: inherit;
    font-size: 22px;
    font-weight: bold;
    padding-top: .5em;
    padding-bottom: .5em;
    margin-bottom: 2em;
    position: relative;
    border-bottom: solid 3px #ffa985;
    color: #757575;
}
#cms_3-d .cate_title:after {
    position: absolute;
    content: " ";
    display: block;
    width: 9%;
    bottom: -3px;
    border-bottom: solid 3px #ab9790;
    left: 0;
    right: 0;
    margin: auto;
}
/* --------------------------header------------------------------ */
#header {
	padding: 0 0 0 100px;
}
#header #logo {
text-align: center;
padding: 10px;
padding-left: 62px;
margin-bottom: 33px;
	border-radius: 35px 0 0 35px;
}
#header #logo img {
	max-width: 216px;
}
#logo span {
    width: 58px;
    right: -57px;
	border-radius: 0 35px 35px 0;
}
header .trans_header {
    top: -168px;/*隠れるところ*/
}
header .trans_logo {
    height: 168px;
	border-radius: 0px 0px 35px 0;
}

#pc_nav ul li a:hover {
	background: url(Dup/img/hana1_2.png) no-repeat 0 50%;
	background-size: auto 100%;
}
#pc_nav ul li:nth-child(odd) a:hover {
	background: url(Dup/img/hana2_2.png) no-repeat 0 50%;
	background-size: auto 100%;
}
.bannerWrap {
	text-align: center;
}
.bannerWrap img {
	margin-top: 10px;
	max-width: 265px;
	border: 1px solid #eee;
	transition: all 0.3s;
}
#sp_nav .bannerWrap {
	margin-left: 0px;
	margin-top: 20px;
	display: block;
}

@media(min-width: 769px) {
	.trans_logo img {
	max-width: 136px;
	display: none;
}
.scrollheader .trans_logo img {
	display: block;
}
	.shopBnr:hover {
	 transform: translateY(-4px);
}
}
@media screen and (min-width:667px) and ( max-width:768px) {
	.con3_left {
	background: #ff7340;
    border-radius: 19px;
    padding: 15px;
    margin-bottom: 37px;
	}

}
.more a {
	border-radius: 10px;
}



/* --------------------------TOP CONTENETS------------------------------ */
.con1_right {
	position: relative;
}
.con1_right:before {
	position: absolute;
	top: 0;
	left: 30px;
content: "";
display: block;
background-color: rgba(255, 237, 219, 1);
background-image: -webkit-radial-gradient(#fff 25%, rgba(255, 237, 219, 0) 50%);
background-image: radial-gradient(#fff6ed 48%, #ffeddb 65%, rgba(255, 237, 219, 0) 80%);
  width: 300px;
  height: 300px;z-index: -1;opacity: 0;
}
.con1_right:after {
    position: absolute;
    bottom: 42%;
    right: 0px;
    content: "";
    display: block;
    background-color: rgba(255, 237, 219, 1);
    background-image: -webkit-radial-gradient(#ddd 25%, rgba(255, 237, 219, 0) 50%);
    background-image: radial-gradient(#fff6ed 48%, #ffeddb 65%, rgba(255, 237, 219, 0) 80%);
    width: 200px;
    height: 200px;
    z-index: -1;
	opacity: 0;
}
#top_cms .top_cms_bg {
	  background-color: #fffcf0;
    background-image: url(Dup/img/ps-neutral.png);
}
#top_cms {
	position: relative;
}
#top_cms:before {
	position: absolute;
    top: 6%;
    right: 0%;
    content: "";
    display: block;
    background-color: rgba(255, 244, 233, 0);
    background-image: radial-gradient(#ffebc0 43%, rgba(255, 237, 219, 0) 69%, rgba(255, 244, 233, 0) 80%);
    width: 700px;
    height: 700px;
    z-index: 0;opacity: 0;transform: translateY(300px);
}
#top_cms:after {
    position: absolute;
    bottom: 1%;
    left: 10%;
    content: "";
    display: block;
    background-color: rgba(255, 244, 233, 0);
    background-image: radial-gradient(#ffebc0 43%, rgba(255, 127, 80, 0) 69%, rgba(255, 244, 233, 0) 80%);
    width: 300px;
    height: 300px;
    z-index: 0;opacity: 0;transform: translateY(300px);
}
.con2_title span, .con3_title span {
	background-color: #efda69;
}
.con3_wrap {

}
#contents2 figure img {
border-radius: 55% 45% 55% 45% / 47% 51% 49% 53% ;
}
#contents3 figure img {
	border-radius: 40% 60% 47% 53% / 50% 43% 57% 50%;
}

#cms_2-a ul {
	display: none;
}
#cms_2-a .cate {
    margin-bottom: 0px;
}
#cms_2-a .cate_title_wrap {
	display: block;
	border-top: 2px solid #d4caa0;
	border-bottom: 2px solid #d4caa0;
	text-align: center;
	margin-bottom: 25px;
}
#cms_2-a .cate_title {
	position: relative;
	padding-left: 2.6rem;
	padding-right: 10px;
	text-align: center;border: none;
	margin-bottom: 0;
}
#cms_2-a .cate_title:before, #cms_2-a .cate_title:after {
	position: absolute;
	content: "";
	display: block;
	width: 12px;
	height: 12px;
	border: 2px solid #d4caa0;
	top: 40%;
	left: 4px;
	transform: rotate(45deg);
}
#cms_2-a .cate_title:after {
	top: 40%;
	left: 11px;
	height: 16px;
	width: 16px;
	transform: rotate(45deg);
	border: none;
	background: #d4caa0
}


#cms_2-a .box_title1 {
	position: relative;
	padding: 0.1em 0.1em 0.5em 0.9em;
	border-left: 10px solid #fdc64b;
	margin-bottom: 10px;
}
#cms_2-a .box_title1::after {
	position: absolute;
	left: 0;
	bottom: 0;
	content: '';
	width: 100%;
	height: 0;
	border-bottom: 3px solid #d8d8d8;
}


@media(max-width: 768px) {
#top_cms:after {
    bottom: 0%;
    left: 5%;
    width: 200px;
    height: 200px;
    z-index: 0;
}
	#top_cms:before {
    top: 6%;
    right: 0%;
    width: 300px;
    height: 300px;
}
header .menu_stick {
    width: 83px;
    right: 0px;
}
	header .trans_header {
    top: 0;
}
header .trans_logo {
    height: 80px;
}
.trans_logo img {
    max-width: 166px;
	filter: drop-shadow(0px 0px 5px rgba(0,0,0,0.2));
}
.con1_right:before {
    top: 21px;
}

	.con1_right {
	padding-top: 90px;
}
	.hana3 {
    left: 0%;
    top: 2%;
}
	.hana4 {
    right: 1%;
    top: 20%;
}
.con3_wrap {
    background-position: right 0% bottom 0%;
    background-size: 19%;
	padding-bottom: 79px;
}

}
@media(max-width: 667px) {
	
	header .menu_stick {
    width: 80px;
    height: 80px;
    right: 0;
}
	.trans_logo img {
    max-width: 109px;
    margin-top: -1px;
}
	#main_img .catch {
    bottom: 4%;
    right: 3%;
    z-index: 10;
    width: 80%;
font-size: 20px;
}
	#header.fadetrans:after {
    opacity: 1;
    transform: none;
    width: 200px;
    height: 200px;
}
	#top_cms:after {
		display: none;
	}
	.con1_left {
		    background-position: center 39%;
	}
		.con3_wrap {
    background-size: 35%;
}
	
	.trans_header .banner a {
	height: 40px;
}
	.trans_header .banner {
	position: fixed;
    bottom: 0;
    width: 205px;
    left: 0;
    margin: 0;
	}
	#page-top {
		bottom: 0!important;
	}
	.shopBnr {
    bottom: 1px;
    right: 11px;
    width: 181px;
}

}

/* --------------------------footer------------------------------ */
@media(max-width: 768px) {

}
@media(max-width: 667px) {
	.footer_bottom {
		padding-left: 10px;padding-right: 10px;
		padding-bottom: 58px;
	}
}
/* --------------------------IE------------------------------ */
@media all and (-ms-high-contrast: none) {
	.more a{
		padding-top: 18px!important;
	}
	.pager li a {
		line-height: 59px;
	}
	#page07 h3, #page07 p {
		padding-top: 18px!important;
	}
	.footer_nav a, #page09 a {
		padding-top: 2px;
	}
	#cms_2-a .cate .cate_title {
		padding-top: 11px!important;
	}
	#cms_2-a .box_title1 {
	padding: 0.1em 0.1em 0.5em 0.9em;	
	}
	#header:after {
		display: none;
	}
}