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

/* -------------------------------------------
	over write
---------------------------------------------- */
@media only screen and (max-width: 767px) {
	#main{padding-bottom: 0;}
}

/* -------------------------------------------
	mv
---------------------------------------------- */
#cmeMain .mv{position: relative;margin-top: 50px;}
#cmeMain .mv .l-container{padding: 0 53px;max-width: 1440px;}
#cmeMain .mv .mv-inner{position: relative;}
#cmeMain .mv .mv-inner>.is-mask{display: block;}
#cmeMain .mv .mv-inner>.is-mask img{width: 100%;}
#cmeMain .mv .mv-heading{display: flex;align-items: center;justify-content: center;position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: +1;}
#cmeMain .mv .mv-heading>span{display: inline-block;vertical-align: top;position: relative;width: calc((462 / 1440) * 100%);}
#cmeMain .mv .mv-heading>span::before{background-color: #fff;content: "";position: absolute;bottom: 0;left: 50%;width: 0;height: 1px;transform: translateX(-50%);}
#cmeMain .mv .mv-heading>span>span{display: block;overflow: hidden;}
#cmeMain .mv .mv-heading>span>span img{width: 100%;transform: translateY(100%);}
#cmeMain .mv .mv-heading.is-active>span::before{animation: mvLine 1.4s ease forwards;}
#cmeMain .mv .mv-heading.is-active>span>span img{animation: mvLogo .7s .5s ease forwards;}
@keyframes mvLine { 0% {width: 0%;opacity: 1;} 80% {opacity: 1;} 100% {width: 106%;opacity: 0;}}
@keyframes mvLogo { 0% {transform: translateY(100%);} 100% {transform: translateY(0);}}
@media only screen and (max-width: 767px) {
	#cmeMain .mv{margin-top: 20px;}
	#cmeMain .mv .l-container{margin: 0 30px;padding: 0;max-width: none;}
	#cmeMain .mv .mv-heading{position: relative;top: auto;left: auto;height: auto;margin-bottom: 20px;}
	#cmeMain .mv .mv-heading>span{width: 208px;}
	#cmeMain .mv .mv-heading>span::before{background-color: #333;}
}

/* -------------------------------------------
	title
---------------------------------------------- */
#cmeMain .title{font-family: 'Noto Serif JP', serif;position: relative;margin-top: 70px;z-index: +1;}
#cmeMain .title .title-heading{font-size: 100%;text-align: center;font-weight: 700;}
#cmeMain .title .title-heading>small{display: block;font-size: calc((14 / 16) * 100%);}
#cmeMain .title .title-heading>span:nth-of-type(1){display: block;font-size: calc((30 / 16) * 100%);line-height: calc(54 / 38);letter-spacing: .07em;margin-top: 15px;}
#cmeMain .title .title-heading>span:nth-of-type(2){display: block;font-size: calc((20 / 16) * 100%);letter-spacing: .25em;margin-top: 20px;}
#cmeMain .title .title-overview{line-height: calc(30 / 16);text-align: center;margin-top: 40px;}
#cmeMain .title .title-overview p+p{margin-top: 1.5em;}
@media only screen and (max-width: 767px) {
	#cmeMain .title{margin-top: 25px;}
	#cmeMain .title .title-heading>small{font-size: calc((11 / 13) * 100%);}
	#cmeMain .title .title-heading>span:nth-of-type(1){font-size: calc((19 / 13) * 100%);margin-top: 10px;}
	#cmeMain .title .title-heading>span:nth-of-type(2){font-size: calc((14 / 13) * 100%);margin-top: 13px;}
	#cmeMain .title .title-overview{text-align: left;line-height: calc(47 / 26);margin-top: 20px;}
}

/* -------------------------------------------
	profile
---------------------------------------------- */
#cmeMain .profile{position: relative;margin-top: 60px;z-index: +1;}
#cmeMain .profile::before{background: url(/club-me/life/mykitchen/img/bg-line.png) 0 top/auto 100% repeat-x;content: "";display: block;position: absolute;top: -150px;left: -2%;width: 150%;height: 398px;transform: rotate(5deg);animation: lineScroll var(--lineAnimeSpeedPc) linear infinite;}
#cmeMain .profile .profile-column{display: flex;justify-content: space-between;margin-right: 40px;}
#cmeMain .profile .profile-img{overflow: hidden;position: relative;width: calc((340 / 1134) * 100%);}
#cmeMain .profile .profile-img>img{width: 100%;}
#cmeMain .profile .profile-txt{position: relative;margin: 120px calc((60 / 1134) * 100%) 20px 0; width: calc((675 / 1134) * 100%);align-self: flex-end;}
#cmeMain .profile .profile-txt::before{border-radius: 100px;background-color: #dde9f0;content: "";position: absolute;top: 0%;left: -30%;z-index: -1;width: calc(50% + ((420 / 675) * 100%));height: calc(50% + 140px);transition: border-radius .8s ease, width .8s ease, height .8s ease, left .8s ease, top .8s ease, opacity .3s ease;opacity: 0;}
#cmeMain .profile .profile-txt.is-bg::before{border-radius: 20px 0 0 0;width: calc(100% + ((420 / 675) * 100%));height: calc(100% + 140px);left: calc((360 / 675) * -100%);top: -60px;opacity: 1;}
#cmeMain .profile .profile-txt .profile-txt__heading{font-size: 0;line-height: 0;}
#cmeMain .profile .profile-txt .profile-txt__heading img{width: 76px;}
#cmeMain .profile .profile-txt .profile-txt__info{margin-top: 15px;}
#cmeMain .profile .profile-txt .profile-txt__info dt{font-family: 'Noto Serif JP', serif;font-size: calc((22 / 16) * 100%);}
#cmeMain .profile .profile-txt .profile-txt__info dt small{font-size: calc((18 / 22) * 100%);}
#cmeMain .profile .profile-txt .profile-txt__info dd{font-size: calc((14 / 16) * 100%);line-height: calc(26 / 14);margin-top: 25px;}
@media only screen and (max-width: 767px) {
	#cmeMain .profile{margin-top: 25px;}
	#cmeMain .profile::before{top: 0;height: 199px;animation: lineScrollSp var(--lineAnimeSpeedSp) linear infinite;}
	#cmeMain .profile .profile-column{display: block;margin-right: 0;}
	#cmeMain .profile .profile-img{margin: 0 auto;width: calc((340 / 750) * 100vw);}
	#cmeMain .profile .profile-txt{margin: 20px 30px 0 30px;padding-bottom: 30px;width: auto;}
	#cmeMain .profile .profile-txt::before{border-radius: 50px;top: auto;bottom: 30%;left: 15%;width: calc(50% + 60px);height: calc(50% + 20px + ((140 / 750) * 100vw));transition: border-radius .8s ease, width .8s ease, height .8s ease, left .8s ease, bottom .8s ease, opacity .3s ease;}
	#cmeMain .profile .profile-txt.is-bg::before{border-radius: 0;top: auto;bottom: 0;left: -30px;width: calc(100% + 60px);height: calc(100% + 20px + ((140 / 750) * 100vw));}
	#cmeMain .profile .profile-txt .profile-txt__heading{text-align: center;}
	#cmeMain .profile .profile-txt .profile-txt__heading img{width: 63px;}
	#cmeMain .profile .profile-txt .profile-txt__info{margin-top: 10px;}
	#cmeMain .profile .profile-txt .profile-txt__info dt{font-size: calc((16 / 13) * 100%);text-align: center;}
	#cmeMain .profile .profile-txt .profile-txt__info dt small{font-size: calc((13 / 16) * 100%);}
	#cmeMain .profile .profile-txt .profile-txt__info dd{font-size: calc((12 / 13) * 100%);line-height: calc(44 / 24);margin-top: 15px;}
}

/* -------------------------------------------
	talk
---------------------------------------------- */
#cmeMain .talk{position: relative;margin-top: 160px;z-index: +1;}
#cmeMain .talk .talk-section+.talk-section{margin-top: 60px;}
#cmeMain .talk .talk-img{text-align: center;}
#cmeMain .talk .talk-txt p+p{margin-top: 1.5em;}
#cmeMain .talk .talk-column{display: flex;justify-content: space-between;}
#cmeMain .talk .talk-column .talk-img{width: calc((480 / 1174) * 100%);}
#cmeMain .talk .talk-column .talk-img img{width: 100%;}
#cmeMain .talk .talk-column .talk-txt{width: calc((615 / 1174) * 100%);}
@media only screen and (max-width: 767px) {
	#cmeMain .talk{margin-top: 45px;}
	#cmeMain .talk .talk-section+.talk-section{margin-top: 35px;}
	#cmeMain .talk .talk-img.talk-img--full-sp{margin-left: -30px;margin-right: -30px;}
	#cmeMain .talk .talk-column{display: block;}
	#cmeMain .talk .talk-column .talk-img{width: auto;margin-top: 35px;}
	#cmeMain .talk .talk-column .talk-txt{width: auto;}
}

/* -------------------------------------------
	items
---------------------------------------------- */
#cmeMain .items{position: relative;margin-top: 110px;padding-bottom: 110px;z-index: +1;}
#cmeMain .items::before{background: url(/club-me/life/mykitchen/img/bg-line.png) 0 top/auto 100% repeat-x;content: "";display: block;position: absolute;top: 100%;left: -25%;width: 150%;height: 398px;transform: rotate(-143deg);animation: lineScroll var(--lineAnimeSpeedPc) linear infinite;}
#cmeMain .items::after{background-color: #dde9f0;border-radius: 100px;content: "";position: absolute;bottom: 0;left: 25%;width: 50%;height: 50%;transition: border-radius .8s ease, width .8s ease, height .8s ease, left .8s ease, bottom .8s ease, opacity .3s ease;z-index: -1;opacity: 0;}
#cmeMain .items.is-bg::after{border-radius: 0;width: 100%;height: calc(100% - 200px);bottom: 0;left: 0;opacity: 1;}
#cmeMain .items .items-column{display: flex;margin: 0 calc((23 / 1174) * -100%);}
#cmeMain .items .items-panel{margin: 0 calc((23 / 1220) * 100%);width: calc(33.3333% - ((46 / 1174) * 100%));}
#cmeMain .items .items-panel:nth-of-type(2){margin-top: 50px;}
#cmeMain .items .items-panel:nth-of-type(3){margin-top: 100px;}
#cmeMain .items .items-img>img{width: 100%;}
#cmeMain .items .items-txt{margin-top: 25px;}
#cmeMain .items .items-txt dt{font-family: 'Noto Serif JP', serif;font-size: calc((18 / 16) * 100%);font-weight: 700;}
#cmeMain .items .items-txt dd{font-size: calc((14 / 16) * 100%);line-height: calc(20 / 14);margin-top: 5px;}
@media only screen and (max-width: 767px) {
	#cmeMain .items{margin-top: 50px;padding-bottom: 60px;}
	#cmeMain .items::before{left: -50%;top: 100%;width: 200%;height: 199px;animation: lineScrollSp var(--lineAnimeSpeedSp) linear infinite;}
	#cmeMain .items::after{border-radius: 50px;bottom:20%;}
	#cmeMain .items.is-bg::after{height: calc(100% - ((260 / 750) * 100vw));}
	#cmeMain .items .items-column{display: block;margin: 0;}
	#cmeMain .items .items-panel{margin: 0;width: auto;}
	#cmeMain .items .items-panel:nth-of-type(2){margin-top: 45px;}
	#cmeMain .items .items-panel:nth-of-type(3){margin-top: 45px;}
	#cmeMain .items .items-img{margin: 0 auto;width: calc((448 / 750) * 100vw);}
	#cmeMain .items .items-txt{text-align: center;margin-top: 15px;}
	#cmeMain .items .items-txt dt{font-size: calc((16 / 13) * 100%);}
	#cmeMain .items .items-txt dd{font-size: calc((12 / 13) * 100%);line-height: calc(40 / 24);margin-top: 3px;}
}

/* -------------------------------------------
	loop
---------------------------------------------- */
#cmeMain .loop{position: relative;margin-top: 120px;z-index: +1;}
@media only screen and (max-width: 767px) {
	#cmeMain .loop{margin-top: 50px;}
}

/* -------------------------------------------
	afterword
---------------------------------------------- */
#cmeMain .afterword{position: relative;margin-top: 95px;z-index: +1;}
#cmeMain .afterword .afterword-wrap{border-top: 1px solid #333;padding-top: 75px;}
#cmeMain .afterword .afterword-heading{background: url(/club-me/life/mykitchen/img/img-afterword-dot.png) center bottom/32px auto no-repeat;font-family: 'Noto Serif JP', serif;font-size: calc((24 / 16) * 100%);line-height: calc(38 / 24);text-align: center;padding-bottom: 30px;}
#cmeMain .afterword .afterword-column{display: flex;justify-content: space-between;margin-top: 50px;}
#cmeMain .afterword .afterword-comment{display: flex;width: calc((775 / 1174) * 100%);}
#cmeMain .afterword .afterword-comment dt{box-sizing: border-box;font-family: 'Noto Serif JP', serif;text-align: center;padding: 0 20px;width: calc((320 / 775) * 100%);}
#cmeMain .afterword .afterword-comment dt img{width: 100%;max-width: 230px;}
#cmeMain .afterword .afterword-comment dt small{display: block;font-size: calc((13 / 16) * 100%);margin-top: 5px;}
#cmeMain .afterword .afterword-comment dt span{display: block;font-size: calc((20 / 16) * 100%);margin-top: 5px;}
#cmeMain .afterword .afterword-comment dd{flex:1;font-size: calc((14 / 16) * 100%);line-height: calc(26 / 14);}
#cmeMain .afterword .afterword-link{box-sizing: border-box;border-left: 1px solid #c6c6c6;padding: 0 calc((40 / 1174) * 100%) 0 calc((60 / 1174) * 100%);width: calc((341 / 1174) * 100%);}
#cmeMain .afterword .afterword-link a{color: #333;display: block;}
#cmeMain .afterword .afterword-link a:hover{text-decoration: none;}
#cmeMain .afterword .afterword-link .afterword-link__heading{margin-bottom: 25px;}
#cmeMain .afterword .afterword-link .afterword-link__heading img{width: 60px;}
#cmeMain .afterword .afterword-link .afterword-link__title .afterword-link__title-img{position: relative;}
#cmeMain .afterword .afterword-link .afterword-link__title .afterword-link__title-img span{border: 1px solid #c6c6c6;display: block;overflow: hidden;}
#cmeMain .afterword .afterword-link .afterword-link__title .afterword-link__title-img img{width: 100%;}
#cmeMain .afterword .afterword-link .afterword-link__title .afterword-link__title-txt{font-size: calc((12 / 16) * 100%);line-height: calc(20 / 12);margin: 20px 0 -10px 0;}
#cmeMain .afterword .afterword-link .afterword-link__title .afterword-link__title-txt p+p{margin-top: 1.5em;}
#cmeMain .afterword .afterword-note{font-size: calc((14 / 16) * 100%);text-align: center;margin-top: 70px;}
@media only screen and (min-width: 768px) {
	#cmeMain .afterword .afterword-link a .afterword-link__title .afterword-link__title-img img{transition: transform 0.3s ease;}
	#cmeMain .afterword .afterword-link a:hover .afterword-link__title .afterword-link__title-img img{transform: scale(1.05);}
}
@media only screen and (max-width: 767px) {
	#cmeMain .afterword{margin-top: 50px;}
	#cmeMain .afterword .afterword-wrap{padding-top: 35px;}
	#cmeMain .afterword .afterword-heading{background-size: 25px auto;font-size: calc((17 / 13) * 100%);line-height: calc(44 / 34);padding-bottom: 25px;}
	#cmeMain .afterword .afterword-column{display:block;margin-top: 20px;}
	#cmeMain .afterword .afterword-comment{display: block;width: auto;}
	#cmeMain .afterword .afterword-comment dt{padding: 0;width: auto;}
	#cmeMain .afterword .afterword-comment dt img{width: calc((322 / 750) * 100vw);max-width: none;}
	#cmeMain .afterword .afterword-comment dt small{font-size: calc((11 / 13) * 100%);margin-top: 0;}
	#cmeMain .afterword .afterword-comment dt span{font-size: calc((15 / 13) * 100%);margin-top: 0;}
	#cmeMain .afterword .afterword-comment dd{flex: initial;font-size: 100%;line-height: calc(44 / 26);margin-top: 15px;}
	#cmeMain .afterword .afterword-link{border-top: 1px solid #c6c6c6; border-left: none;margin-top: 30px;padding: 35px 0 0 0;width: auto;}
	#cmeMain .afterword .afterword-link a{color: #333;display: block;}
	#cmeMain .afterword .afterword-link a:hover{text-decoration: none;}
	#cmeMain .afterword .afterword-link .afterword-link__heading{margin: 20px 0 0 0;text-align: center;}
	#cmeMain .afterword .afterword-link .afterword-link__heading img{width: 45px;}
	#cmeMain .afterword .afterword-link .afterword-link__title .afterword-link__title-img{margin: 0 auto;width: calc((362 / 750) * 100vw);}
	#cmeMain .afterword .afterword-link .afterword-link__title .afterword-link__title-txt{font-size: calc((12 / 13) * 100%);line-height: calc(44 / 24);margin: 5px 0 -5px 0;}
	#cmeMain .afterword .afterword-note{font-size: 100%;text-align: center;margin-top: 50px;}
}