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

/*メインビジュアル*/
/*メインビジュアル移動する場合不要.main-visual {padding-top: 68px;}*/
.top-cp {font-size: 5rem;font-weight: bold;line-height: 1.45;padding: 4.3rem 0 2.5rem 0;color:#1A6878;}
.m1 {position: relative;}
.m2, .m3 {position: absolute;top: 0;left: 0;z-index: -1;}
.top-text {font-size:1.5rem;font-weight: 500;line-height: 2.688rem;max-width: 620px;/*メインビジュアル移動する場合不要padding-bottom: 8.69rem;*/}
.m2 {padding: 3rem 0 0 36rem;position: relative;margin: 0 auto;width: 90%;}
.m2 img{position: absolute;}

.anime{animation-timing-function: ease-in-out;animation-iteration-count: infinite;animation-direction: alternate;animation-name: anim_v;}
.shirt {margin:0 auto;animation-duration: 3.3s;max-width:250px;top: -25rem;left: 31rem;}
@keyframes anim_v {0% {transform: translate(0, 0px);}100% {transform: translate(0, 26px);}}
.kinchaku {margin:0 auto;animation-duration: 3.5s;max-width:90px;top: -24rem;left: 47rem;}
@keyframes anim_v {0% {transform: translate(0, 0px);}100% {transform: translate(0, 15px);}}
.pouch {margin:0 auto;animation-duration: 3.6s;max-width:90px;top: -18rem;left: 50rem;}
@keyframes anim_v {0% {transform: translate(0, 0px);}100% {transform: translate(0, 20px);}}
.cushion{margin:0 auto;animation-duration: 4.3s;max-width:170px;top: -21rem;left: 58rem;}
@keyframes anim_v {0% {transform: translate(0, 0px);}100% {transform: translate(0, 23px);}}
.cup {margin:0 auto;animation-duration: 3.4s;max-width:95px;top: -8rem;left: 35rem;}
@keyframes anim_v {0% {transform: translate(0, 0px);}100% {transform: translate(0, 26px);}}
.spoon {margin:0 auto;animation-duration: 3.8s;max-width:50px;top: -5rem;left: 42rem;}
@keyframes anim_v {0% {transform: translate(0, 0px);}100% {transform: translate(0, 22px);}}
.note {margin:0 auto;animation-duration: 4.8s;max-width:195px;top: -1rem;left: 58rem;}
@keyframes anim_v {0% {transform: translate(0, 0px);}100% {transform: translate(0, 28px);}}
.tape {margin:0 auto;animation-duration: 4.2s;max-width:100px;top: -8rem;left: 62rem;}
@keyframes anim_v {0% {transform: translate(0, 0px);}100% {transform: translate(0, 22px);}}
.acsta {margin:0 auto;animation-duration: 3.3s;max-width:100px;top: 3rem;left: 37rem;}
@keyframes anim_v {0% {transform: translate(0, 0px);}100% {transform: translate(0, 24px);}}
.glass {margin:0 auto;animation-duration: 4.5s;max-width:125px;top: 3rem;left: 45rem;}
@keyframes anim_v {0% {transform: translate(0, 0px);}100% {transform: translate(0, 20px);}}
.badge {margin:0 auto;animation-duration: 4s;max-width:80px;top: -9rem;left: 47rem;}
@keyframes anim_v {0% {transform: translate(0, 0px);}100% {transform: translate(0, 18px);}}
.pen {margin:0 auto;animation-duration: 3.5s;max-width:50px;top: 0rem;left: 52rem;}
@keyframes anim_v {0% {transform: translate(0, 0px);}100% {transform: translate(0, 15px);}}

/*新着情報*/
#home-info .inner-p {max-width: 1537px;background-color:#FCE8E8;border-radius: 0 113px 113px 0;padding: 2.5rem 0;}
#home-info .inner-p .flx {max-width: 1200px;margin: 0 3rem 0 auto;}
#home-info h2 {color:#1A6878;padding: 2.65rem 2.25rem 2.65rem 0;margin: auto 2.25rem auto 0;border-right: 2px solid #1A6878;}
#home-info .inner-p dl {padding: 0.5rem 0;font-weight: 500;}
#home-info .inner-p dl dt, #home-info .inner-p dl dd{display: table-cell;vertical-align: middle;line-height: 1.125rem;}
#home-info .inner-p dl dd {padding-left: 1rem;max-width: 450px;}
#home-info .date{font-weight:normal;width: 106px;}
#home-info .btn-wrap {margin: auto 4rem 0 auto;}
#home-info .btn {margin-bottom: 0;}

/*作品から探す
#home-works ul li img {max-width: 180px;width: 100%;margin: 0 auto;display: block;}*/


/*新着商品*/
.banner {margin: 0 auto;max-width: 640px;width: 100%;}

/*twitter*/
#home-x .inner960 {background-color: #FCE8E8;border-radius: 53px;padding-bottom: 3.5rem;margin: 0 auto;}
#home-x h2 {padding: 4.125rem 0 1.5rem 0;}
.x-wrap {max-width: 640px;margin: 0 auto;border: 3px solid #1A6B78;border-radius: 15px;}
.x-wrap a {height:330px;}
.x-wrap2 p {text-align: center;line-height: 1.7rem;font-size: 1.2rem;font-weight: bold;}
.x-wrap2 .x-1 {padding: 1rem 0;}
.x-wrap2 a {text-decoration-line: underline;color: #0FA3BC;}

/*ツインクルについて*/
#home-company div {margin: 1rem auto 0 auto;justify-content: space-between;}
#home-company div p {padding-bottom: 1.8rem;}
#home-company img {max-width: 509px;margin: 0 auto;box-shadow: 0px 3px 6px rgba(0,0,0, 0.16);}
#home-company .h2deco-y::before{left: -200px;}


/*採用情報*/
#home-recruit {margin: -15rem 0 0 0;padding: 3rem 0 0 0;}
.bg-wave {position: relative;z-index: -10;}
.bg{background: #FCE8E8;padding-bottom: 3rem;}
.recruit-banner {max-width: 720px;margin: -1px auto;padding: 5rem 0 0 0;}
.recruit-banner img{box-shadow: 0px 3px 6px rgba(0,0,0, 0.16);}

@media screen and (max-width:1560px){
	#home-info .inner-p {margin-right: 2rem;padding-left: 2rem;}
	#home-info .inner-p .flx {margin: 0 auto;}
}
@media screen and (max-width:1350px){
	#home-info .inner-p {margin: 0 auto;border-radius: 0;}
}
@media screen and (max-width:1250px){
	.top-cp, .top-text {margin-left: 2rem;}
	.shirt{max-width:230px;top: -21rem;left: 27rem;}
	.kinchaku{max-width:90px;top: -20rem;left: 42rem;}
	.pouch{max-width:90px;top: -14rem;left: 44rem;}
	.cushion{max-width:156px;top: -17rem;left: 52rem;}
	.cup{max-width:85px;top: -4rem;left: 32rem;}
	.spoon{max-width:40px;top: -1rem;left: 38rem;}
	.note{max-width:180px;top: 3rem;left: 51rem;}
	.tape{max-width:90px;top: -4rem;left: 55rem;}
	.acsta{max-width:90px;top: 5rem;left: 34rem;}
	.glass{max-width:105px;top: 7rem;left: 41rem;}
	.badge{max-width:75px;top: -5rem;left: 43rem;}
	.pen {max-width:50px;top: 3rem;left: 47rem;}
	.top-cp{font-size: 4rem;}
	.m2{padding: 3rem 0 0 32rem;}
	.top-text{font-size: 1.25rem;padding-bottom: 5rem;}
	#home-info .inner-p {margin: 0 auto;border-radius: 0;padding-left: 0;}
	#home-info .inner-p .flx {display: block;}
	#home-info .inner-p h2 {border-right: none;margin: 0 auto;padding: 3.75rem 0 3rem 0;}
	#home-info .inner-p dl dd {max-width: 1000px;}
	.bg-w-sp {background-color: #fff;padding:1.5rem 2rem;margin: 2rem auto 2.375rem auto;}	
}
@media screen and (max-width:1075px){
	.m2{ padding: 3rem 0 0 30rem;}
	.shirt{max-width:230px;top: -21rem;left: 24rem;}
	.kinchaku{max-width:90px;top: -20rem;left: 39rem;}
	.pouch{max-width:90px;top: -14rem;left: 40rem;}
	.cushion{max-width:156px;top: -17rem;left: 47rem;}
	.cup{max-width:85px;top: -4rem;left: 29rem;}
	.spoon{max-width:40px;top: -1rem;left: 35rem;}
	.note{max-width:180px;top: 3rem;left: 46rem;}
	.tape{max-width:90px;top: -4rem;left: 49rem;}
	.acsta{max-width:90px;top: 5rem;left: 31rem;}
	.glass{max-width:105px;top: 7rem;left: 38rem;}
	.badge{max-width:75px;top: -5rem;left: 40rem;}
	.pen {max-width:50px;top: 3rem;left: 41rem;}
}

@media screen and (max-width:1050px){	
	#home-company img {max-width: 380px;}
	#home-company .btn-wrap{text-align: center;}
	.reverse {display: block;text-align: center;}
	#home-company .flx {display: block;text-align: center;}
}
@media screen and (max-width:1000px){
	.m1{padding-left: 0;}
	.top-cp{font-size: 3.5rem;}
	.m2 {padding: 3rem 0 0 27rem;}
	.top-cp,.top-text {margin-left: 1.5rem;}
	.shirt{max-width:205px;top: -18rem;left: 24rem;}
	.kinchaku{max-width:75px;top: -19rem;left: 37rem;}
	.pouch{max-width:75px;top: -13rem;left: 38rem;}
	.cushion{max-width:145px;top: -17rem;left: 44rem;}
	.cup{max-width:80px;top: -4rem;left: 29rem;}
	.spoon{max-width:40px;top: -1rem;left: 35rem;}
	.note{max-width:160px;top: 3rem;left: 44rem;}
	.tape{max-width:70px;top: -4rem;left: 47rem;}
	.acsta{max-width:80px;top: 5rem;left: 31rem;}
	.glass{max-width:90px;top: 7rem;left: 37rem;}
	.badge{max-width:65px;top: -5rem;left: 39rem;}
	.pen {max-width:45px;top: 3rem;left: 40rem;}
	#home-info .inner-p dl dd{display:block;padding: 0.3rem 0 0 0;}
	.x-wrap {width: 90%;}
}

@media screen and (max-width:935px){
	.top-cp{padding: 1.3rem 0 2.3rem 0;}
	.m2{/*position: relative;margin: 0 auto;*/width: 90%;}
	/*.m2 img{position: absolute;}*/
	.top-text{margin: 9rem auto 0;text-align: center;line-height: 2;}
	.shirt {margin:0 auto;top: -7rem;left: 12rem;}
	.kinchaku {margin: 0 auto;top: -15rem;left: 23rem;}
	.pouch {margin: 0 auto;top: -11rem;left: 28rem;}
	.cushion{margin: 0 auto;top: -15rem;left: 35rem;}
	.cup {margin: 0 auto;top: 100%;left: 5rem;}
	.spoon {margin: 0 auto;top: 6rem;left: 10rem;}
	.note {margin: 0 auto;top: 2rem;left: 34rem;}
	.tape {margin: 0 auto;top: -2rem;left: 32rem;}
	.acsta {margin: 0 auto;top: 3rem;left: 24rem;}
	.glass {margin: 0 auto;left: 14rem;}
	.badge {margin: 0 auto;top: 0;left: 4rem;}
	.pen {margin: 0 auto;top: -2rem;left: 27rem;}
@keyframes anim_v {0% {transform: translate(0, 0px);}100% {transform: translate(0, 20px);}}
@keyframes anim_v {0% {transform: translate(0, 0px);}100% {transform: translate(0, 10px);}}
@keyframes anim_v {0% {transform: translate(0, 0px);}100% {transform: translate(0, 12px);}}
@keyframes anim_v {0% {transform: translate(0, 0px);}100% {transform: translate(0, 12px);}}
@keyframes anim_v {0% {transform: translate(0, 0px);}100% {transform: translate(0, 18px);}}
@keyframes anim_v {0% {transform: translate(0, 0px);}100% {transform: translate(0, 15px);}}
@keyframes anim_v {0% {transform: translate(0, 0px);}100% {transform: translate(0, 20px);}}
@keyframes anim_v {0% {transform: translate(0, 0px);}100% {transform: translate(0, 15px);}}
@keyframes anim_v {0% {transform: translate(0, 0px);}100% {transform: translate(0, 18px);}}
@keyframes anim_v {0% {transform: translate(0, 0px);}100% {transform: translate(0, 12px);}}
@keyframes anim_v {0% {transform: translate(0, 0px);}100% {transform: translate(0, 11px);}}
@keyframes anim_v {0% {transform: translate(0, 0px);}100% {transform: translate(0, 9px);}}
	
}
@media screen and (max-width:840px){
	#home-company img {margin-bottom: 0.8rem;}
	.bg-wave {padding-top: 5rem;}

	
}
@media screen and (max-width:800px){
	.pouch {left: 25rem;}
	.cushion{left:30rem;}
	.note{left: 30rem;}
	.tape {left: 31rem;}
	.acsta{left:22rem;}
}
@media screen and (max-width:760px){
	#home-info .btn-wrap {margin: auto 1rem 0 auto;}
	.h2deco-y::before{left: -180px;}
	.h2decosp-w::before, .h2deco-w::before{left: -100px;}
	#home-info .h2decosp-w::before{left: -100px;}
	#home-new-items .h2deco-w::before{left: -100px;}
	#home-info .date{width: 80px;}
	
	#home-info{padding: 0;}
	.bg-w-sp {margin: 0 auto 2rem auto;}
	#home-info .inner-p{padding: 0 0 2.5rem 0;}
	#home-info .inner-p dl {padding: 0.5rem 0;}
	#home-info dt {font-size:0.75rem;}
	#home-info dd {font-size:0.875rem;}
	
	.recruit-banner img {display: block;width: 96%;margin: 0 auto;}
	.top-cp{font-size:2.5rem;}
	.m2{margin: 0 auto 0 6rem;}
	.shirt {max-width:180px;top: -6rem;left: 10rem;}
	.kinchaku {top: -14rem;left: 16rem;}
	.pouch {top: -10rem;left: 20rem;}
	.cushion{max-width:120px;top: -9rem;left:25rem;}
	.cup {left: 1rem;}
	.spoon {left: 6rem;}
	.note {max-width:125px;left: 25rem;}
	.tape {max-width:70px;top: 0;left: 29rem;}
	.acsta {left: 18rem;}
	.glass {left: 10rem;}
	.badge {left: 2rem;}
	.pen {left: 22rem;}
	
}
@media screen and (max-width:700px){
	.m2{margin: 0 auto 0 4rem;}
}
@media screen and (max-width:655px){
	.m2{margin: 0 auto;}
}
@media screen and (max-width:600px){
	.top-cp{font-size:2.25rem;padding-top: 0;}
	.m2{margin-left: 3rem;}
	.top-text{font-size: 0.938rem;padding-bottom: 2rem;}
	.shirt {max-width:170px;top: -6rem;left: 8rem;}
	.kinchaku {max-width:65px;top: -12rem;left: 14rem;}
	.pouch {max-width:65px;top: -10rem;left: 18rem;}
	.cushion{left:22rem;}
	.cup {max-width:65px;top: 100%;left: 0;}
	.spoon {top: 6rem;left: 4rem;}
	.note {top: 3rem;left: 21rem;}
	.tape {max-width:55px;top: -0.5rem;left: 24rem;}
	.acsta {max-width:70px;top: 2rem;left: 16rem;}
	.glass {left: 8rem;}
	.badge {max-width:60px;top: 0;left: 0;}
	.pen {max-width:40px;top: -2rem;left: 20rem;}
	.x-wrap2 p{font-size: 1rem;}
}
@media screen and (max-width:550px){
	.m2{margin-left: 2rem;}
	.bg-wave {padding-top: 6rem;}
}
@media screen and (max-width:530px){
	.m2{margin-left: 1rem;}
	.shirt {max-width:155px;top: -5rem;left: 6rem;}
	.kinchaku {max-width:60px;top: -12rem;left: 14rem;}
	.pouch {max-width:60px;top: -9rem;left: 15rem;}
	.cushion{max-width: 100px;left:20rem;}
	.cup {max-width:65px;top: 100%;left: 0;}
	.spoon {top: 6rem;left: 4rem;}
	.note {top: 2rem;left: 20rem;}
	.tape {top: -0.5rem;left: 21rem;}
	.acsta {max-width:60px;top: 5rem;left: 14rem;}
	.glass {max-width:75px;left: 7rem;}
	.badge {max-width:60px;top: 0;left: 0;}
	.pen {top: -2rem;left: 17rem;}
	.bg-w-sp {padding: 1.5rem 0.8rem;}
    
}

@media screen and (max-width:500px){
	#home-info .btn-wrap {margin: auto 0.5rem 0 auto;}
}
@media screen and (max-width:480px){	
	.shirt {max-width:155px;top: -5rem;left: 5rem;}
	.kinchaku {max-width:55px;top: -12rem;left: 14rem;}
	.pouch {max-width:55px;top: -9rem;left: 15rem;}
	.cushion{top: -8rem;left:18rem;}
	.cup {max-width:65px;top: 100%;left: 0;}
	.spoon {top: 6rem;left: 4rem;}
	.note {top: 2rem;left: 17rem;}
	.tape {top: -0.5rem;left: 20rem;}
	.acsta {max-width:60px;top: 5rem;left: 13rem;}
	.glass {max-width:75px;left: 7rem;}*
	.badge {max-width:60px;top: 0;left: 0;}
	.pen {top: -2rem;left: 15rem;}
}
@media screen and (max-width:440px){	
	.shirt {width:140px;top: -5rem;left: 5rem;}
	.kinchaku {max-width:55px;top: -12rem;left: 14rem;}
	.pouch {max-width:55px;top: -9rem;left: 15rem;}
	.cushion{max-width: 105px;top: -6rem;left:16rem;}
	.cup {max-width:60px;top: 100%;left: 0;}
	.spoon {top: 6rem;left: 4rem;}
	.note {max-width:110px;top: 4rem;left: 16rem;}
	.tape {top: 1rem;left: 18rem;}
	.acsta {max-width:50px;top: 4rem;left: 12rem;}
	.glass {max-width:75px;left: 7rem;}
	.badge {max-width:55px;top: 0;left: 0;}
	.pen {top: 0;left: 15rem;}
}
@media screen and (max-width:400px){
	.top-text{letter-spacing: 0.018rem;}
	.shirt {width:130px;top: -5rem;left: 6rem;}
	.kinchaku {max-width:50px;top: -11rem;left: 15rem;}
	.pouch {max-width:50px;top: -8rem;left: 16rem;}
	.cushion{max-width: 85px;top: -4.5rem;left:15rem;}
	.cup {max-width:55px;top: 100%;top: 6rem;left: 1rem;}
	.spoon {max-width:35px;top: 4rem;left: 4.5rem;}
	.note {max-width:95px;top: 5rem;left: 14rem;}
	.tape {max-width:45px;top: 2rem;left: 16rem;}
	.acsta {max-width:55px;top: 3rem;left: 10rem;}
	.glass {max-width:70px;top: 7rem;left: 6rem;}
	.badge {max-width:50px;top: 0;left: 2rem;}
	.pen {max-width:32px;top: 1rem;left: 13rem;}
}
@media screen and (max-width:372px){
	#twitter-widget-0 {width:250px!important;}
}
@media screen and (max-width:360px){	
	.shirt {width:130px;top: -5rem;left: 5.5rem;}
	.kinchaku {max-width:50px;top: -12rem;left: 15.5rem;}
	.pouch {max-width:50px;top: -9rem;left: 16.5rem;}
	.cushion{max-width: 85px;top: -5rem;left:14rem;}
	.cup {max-width:55px;top: 100%;left: 1rem;}
	.spoon {max-width:30px;top: 6rem;left: 4.5rem;}
	.note {max-width:95px;top: 3rem;left: 14rem;}
	.tape {max-width:45px;top: 0.5rem;left: 15rem;}
	.acsta {max-width:50px;top: 5rem;left: 10.5rem;}
	.glass {max-width:70px;top: 3rem;left: 6rem;}
	.badge {max-width:50px;top: 0;left: 1.5rem;}
	.pen {max-width:32px;top: 1rem;left: 12rem;}
}