/* -- 共通 -- */
@import url(https://fonts.googleapis.com/css?family=Oswald:500);
@import url(https://fonts.googleapis.com/css?family=Sorts+Mill+Goudy);
body {
font-size: unset;
}
#main {text-align: left;font-size: 16px;line-height: 1.8;padding: 0 10px;}
#main p{text-align: left;font-size: 16px;margin: 20px 0;line-height: 1.8;}
#main p.center{text-align: center;font-size: 16px;}
#main .purple{color:#d13c7b;font-size:24px;text-align: center;}
#main .marker{background:linear-gradient(transparent 60%,#fff799 60%);background:-webkit-linear-gradient(transparent 60%,#fff799 0);color:#ff6a06;font-weight:700}
  #main .marker_yellow {
    color: #d13c7b;
    font-size: 110%;
    font-weight: bold;
    background: linear-gradient(transparent 60%, #fff799 60%);
  }

header.is-scroll .inner {
margin-top:0;
}

#main .content-inner {
max-width: 1200px;
margin: 0 auto;
padding: 0;
position: relative;
}
#main .pc-absolute {
position: absolute;
}
#main #contents .bg {
padding: 34px 0 50px;
background: #f5f3e9;
}
#main #contents h2 {
margin: 0 0 16px;
color: #967d59;
font-size: 30px;
}
#main #contents .tac {
line-height: 2.3;
}
#main #contents a {
color: #3e2e18;
}



/* -- pc style -- */
@media print, screen and (min-width: 768px) {

#main .img-pc-only {
display: block !important;
}
#main .img-sp-only {
display: none !important;
}
  #main .pc-none {
    display: none!important;
  }
  #main .sp-none {
    display: block !important;
  }
/* -- KV&CTA -- */
#main {
margin-top: 110px;
color: #5b4013;
background: #FFF;
}

#main h2.el_fv_ttl {
  max-width: fit-content;
  margin: 0 auto;
}

#main .bl_introduction {
  max-width: 1000px;
  background: linear-gradient(180deg, #fff 0%, #fff 50%, #94c5e3 50%, #94c5e3 100%);
  margin: 40px auto 50px;
  position: relative;
  height: 533px;
}

#main .bl_introduction_cont {
  max-width: 863px;
  position: absolute;
  top: 211px;
  left: 30px;
  padding: 36px 39px 39px;
  background: #fff;
}

#main p.bl_introduction_txt {
  font-size: 18px;
  margin: 0;
  line-height: 2;
  letter-spacing: .12em;
}

#main .bl_txtCl_pink {
  color: #d76291;
  font-weight: bold;
}

#main .recommend {
padding: 0 0 60px 0;
margin: 40px auto;
background: #f1e9e5;
text-align: center;
}
#main .recommend.__pt {
  margin: 108px 0 0 0;
}
#main .recommend.__pt02 {
  margin: 59px 0 0 0;
}
#main .recommend.__pt03 {
  margin: 87px 0 0 0;
}

#main .recommend  .souryo{
width: 120px;
vertical-align: sub;
margin-right: 10px;
}



#main .recommend .content-inner,#main .el_traialCont .content-inner {
  max-width: 998px;
  width: 100%;
  margin: -50px auto 0px;
  background: #fff;
  border: 2px solid #e8c2d2;
  z-index: 1;
  position: relative;
}
#main .recommend .content-inner.__bsBlue {
  border: 2px solid #b8dfe0;
}
#main .el_traialCont .content-inner.__bsGreen {
  border: 2px solid #c4d7af;
}

#main .recommend .content-inner .box,#main .el_traialCont .content-inner .box {
display: flex;
flex-wrap: wrap;
width: 100%;
margin-top:50px;
}

#main .recommend .content-inner .box .left,#main .el_traialCont .content-inner .box .left {
  width: 250px;
  padding: 40px 0 0 60px;
  text-align: center;
  margin-right: 45px;
}

#main .recommend .content-inner .box .left a{
 display: inline-block;
}

#main .recommend .content-inner .box .left.__pd {
  padding: 35px 0 0 60px;
}

#main .recommend .content-inner .box .right,#main .el_traialCont .content-inner .box .right {
width: 600px;
}
#main .recommend .title,#main .el_traialCont .title {
margin: 0 auto 0;
text-align: center;
width: 100%;
max-width: 1000px;
z-index:2;
position: relative;
}

#main h2.el_recommend_ttl {
  text-align: center !important;
  max-width: 100%;
  padding: 13px 0 11px 0;
  line-height: 0;
  margin: 0 0 30px 0 !important;
  background: radial-gradient(circle, rgb(227 212 163) 20%, rgb(213 199 132) 40%, rgb(192 181 86) 55%, rgb(182 170 55));
}

#main h3.el_trial_ttl {
  padding: 60px 0 15px;
  text-align: center;
}
#main h3.el_trial_ttl.__pt {
  padding: 15px 0 15px;
}

#main .recommend h2,#main .el_traialCont h2 {
  text-align: left;
  font-size: 28px;
  font-weight: bold;
  letter-spacing: 0.05em;
}
#main .recommend h2 {
  max-width: 100%;
  margin: 30px 0;
}
#main .el_traialCont h2 {
  margin: 30px 0 -15px;
}

#main .recommend h2 span,#main .el_traialCont h2 span{
font-size: 80%;
}

#main .recommend p.price img,#main .el_traialCont p.price img{
max-width: 562px;
width: 100%;
}
#main .recommend ul.benefit_box,#main .el_traialCont ul.benefit_box {
  display: flex;
  width: 100%;
}
#main .recommend ul.benefit_box {
  margin: 0 auto;
}
#main .el_traialCont ul.benefit_box {
  margin: 0 0 -15px 0;
}

#main .recommend ul.benefit_box li,#main .el_traialCont ul.benefit_box li {
  text-align: center;
  padding: 0 10px 0 0;
}

#main .recommend ul.benefit_box li p {
color: #d13c7b;
font-size: 26px;
font-weight: bold;
text-align: center;
line-height: 1.2;
margin: 0;
}

#main .recommend ul.benefit_box li p span {
color: #5b4013;
font-size: 80%;
font-weight: normal;
}

#main .recommend p.notice,
#main .el_traialCont p.notice{
  font-size: 14px;
  font-weight: bold;
  letter-spacing: 0.07em;
  margin-top: 0;
}
#main .el_traialCont p.notice{
  margin: -15px auto 10px;
}

#main .recommend p.notice.__pb {
  padding-bottom: 20px;
}

#main .recommend p.btn_seibun a{
display: block;
text-align: center;
color: #5b4013;
text-decoration: none;
font-weight: bold;
padding: 10px 20px;
letter-spacing: 0.05em;
}
#main .recommend p.btn_seibun a:hover{
opacity: 0.6;
}
#main .el_traialCont p.btn_seibun a{
display: block;
text-align: center;
color: #5b4013;
text-decoration: none;
font-weight: bold;
padding: 10px 20px;
letter-spacing: 0.05em;
}
#main .el_traialCont p.btn_seibun a:hover{
opacity: 0.6;
}
#main .recommend p.btn_seibun{
text-align: center;
margin:10px auto;
background: #dedcc6;
border-radius: 30px;
}
#main .el_traialCont p.btn_seibun{
text-align: center;
margin:10px auto;
background: #dedcc6;
border-radius: 30px;
}

#main p.el_recommend_btn img {
  width: 578px !important;
}
#main p.el_recommend_btn.__pb {
  padding-bottom: 20px;
}
#main p.el_recommend_btn.__pb02 {
  padding: 8px 0 67px 0;
}

/* 追加ここから */
#main .recommend .recommend_content {
  display: flex;
  flex-direction: column-reverse;
  margin: 20px auto;
  width: 100%;
}

#main .recommend__content {
  display: flex;
  flex-direction: column-reverse;
  width: 100%;
}

#main .recommend__benefit-box {
  display: flex;
  align-items: center;
  gap: 10px;
}

#main .bl_singleitem_box {
  padding-top: 40px;
}
#main p.el_trial_btn.__pb {
  padding-bottom: 20px;
}

#main .bl_trial_box.__pb {
  padding-bottom: 80px;
}

/* -- ABOUT -- */


#main #about {
padding: 110px 0;
margin: auto;
}
#main #about h2 {
margin: 0 0 24px;
font-size: 24px;
}

#main #about .content-box  {
margin: 34px auto 0;
padding: 0;
background: url(../images/about_bg.png) no-repeat;
background-size: 100% 100%;
width: 100%;
}
#main #about .content-box .box-inner {
margin: auto;
padding: 40px;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
}
#main #about .content-box .box-inner .left {
width: 70%;
}
#main #about .content-box .box-inner .right {
width: 30%;
text-align: right;
}
#main #about .img-photo-2 {
width: 100%;
max-width: 300px;
}


#main #nayami {
padding: 16px 0;
}
#main #nayami h2 {
height: 104px;
margin: 0;
background: url(../images/feature_ttl.png) no-repeat center;
font-size: 32px;
line-height: 104px;
background-size: 80% 100%;
position: relative;
}
#main #nayami .content-box {
width: 90%;
margin: -60px auto 0;
padding: 100px 30px 30px;
border: 1px solid #ede8e4;
box-shadow: 0 0 5px 5px #faf7f4;
text-align: center;
}
#main #nayami ul {
display: inline-flex;
flex-wrap: wrap;
max-width: 900px;
}
#main #nayami li {
width: 33.3333333333%;
font-size: 22px;
margin-bottom: 30px;
font-weight: bold;
color: #74705e;
text-align: left;
}
#main #nayami li::before {
content: url(../images/check.png);
margin-right: 10px;
}
#main #nayami h3 {
color: #d13c7b;
font-size: 22px;
text-align: center;
margin-top: 30px;
}
#main #feature {
padding: 70px 0 0;
}
#main #feature h2 {
height: 104px;
margin: 0 0 44px;
background: url(../images/feature_ttl.png) no-repeat;
background-size: 100% 100%;
font-size: 30px;
line-height: 104px;
}
#main #feature .content-box {
padding: 0 0 30px;
border-bottom: 1px solid #ede8e4;
width: 100%;
}
#main #feature .content-box .box-inner {
margin: 20px auto;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
width: 100%;
}
#main #feature .content-box .box-inner .left {
width: 70%;
}
#main #feature .content-box .box-inner .right {
width: 30%;
}

#main #feature .content-box2 {
width: 100%;
}
#main #feature .content-box2 .box-inner {
margin: auto;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items:stretch;
}
#main #feature .content-box2 .box-inner2 {
margin: auto;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items:stretch;
}
#main #feature .content-box2 .box-inner .left {
width: 49%;
}
#main #feature .content-box2 .box-inner .right {
width: 48%;
}
#main #feature .content-box2 .box-inner2 .photo {
width: 26%;
margin-right: 3%;
}
#main #feature .content-box2 .box-inner2 .photo img{
width: 100%;
}
#main #feature .content-box2 .box-inner .txt {
width: 70%;
}
#main #feature .content-box2 .box-inner2 .photo2 {
width: 20%;
margin-right: 3%;
}
#main #feature .content-box2 .box-inner2 .photo2 img{
width: 100%;
}
#main #feature .content-box2 .box-inner2 .txt2 {
width: 74%;
}



#main #feature h3 {
color: #d13c7b;
font-size: 28px;
font-weight: normal;
margin-bottom: 20px;
}
#main #feature h3 span.bold{
font-weight: bold;
}
#main #feature .img-number {
margin: 0 22px 0 0;
}
#main #feature .txt-common {
padding: 14px 0 0 84px;
line-height: 2.2;
font-size: 18px;
}
#main #feature .img-photo {
max-width: 380px;
width: 100%;
}

#main #feature .holder {
position: relative;
width: 100%;
background: #fbf1f8;
}
#main #feature .holder .inner {
padding: 20px;
}
#main #feature .holder h4 {
color: #d13c7b;
font-size: 20px;
font-weight: bold;
}

#main #feature .content-wrap-inner {
padding: 30px;
background: url(../images/feature_bg.jpg);
}

#main #feature .photos {
display: inline-flex;
align-items: center;
justify-content: center;
}
#main #feature .photos li {
padding: 10px;
}


#main #episode {
padding: 54px 0 60px;
}
#main #episode h2 {
text-align: center;
}
#main #episode h2 .absolute {
bottom: -6px;
right: 246px;
font-size: 12px;
}
#main #episode .img-ttl-second {
margin: 0 0 24px 28px;
}
#main #episode h3 {
margin: 0 0 32px;
color: #7c732c;
font-size: 30px;
text-align: center;
}
#main #episode h3 .fs-48 {
margin: 0 -2px;
vertical-align: -2px;
font-size: 48px;
}
#main #episode .content-box {
position: relative;
padding: 14px;
border: 1px solid #ddd8b8;
margin-bottom: 20px;
}

#main #episode .content-box {
padding: 0 0 30px;
border-bottom: 1px solid #ede8e4;
width: 100%;
}
#main #episode .content-box .box-inner {
margin: auto;
padding: 40px;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
}
#main #episode .content-box .box-inner .left {
width: 28%;
margin-right: 2%;
}
#main #episode .content-box .box-inner .right {
width: 70%;
}

#main #episode h4 {
margin: 0 0 20px;
color: #d13c7b;
font-size: 28px;
line-height: 1.4;
font-weight: normal;
}
#main #episode h4 .pc-absolute {
bottom: 10px;
right: 24px;
width: 12%;
}
#main #episode .txt-wrap {
max-width: 644px;
width: 50%;
}
#main #episode .photo {
max-width: 470px;
width: 100%;
}
#main #episode .txt-wrap {
margin: 22px 24px 0 0;
}



#main #story .bg {
padding: 32px 0 64px;
background: #faf7f4;
}
#main #story h2 {
margin: 0 0 28px;
padding: 0;
color: #aa9e4d;
font-size: 28px;
text-align: center;
}
#main #story .our-story {
margin: 0 30px 0 0;
vertical-align: middle;
}
#main #story .our-story img {
vertical-align: -40px;
}
#main #story h3 {
margin: 0 0 30px;
font-weight: bold;
color: #d13c7b;
font-size: 30px;
text-align: center;
}
#main #story h4.center {
text-align: center;
}
#main #story .mark {
position: absolute;
top: -30px;
left: 30px;
}
#main #story .content-box {
position: relative;
border: 1px solid #ede8e4;
background: #fff;
overflow: hidden;
}
#main #story .content-box.first {
padding: 64px 0 80px;
margin: 0 10px;
}
#main #story .content-box.second {
padding: 64px 70px 70px;
margin: 0 10px;
}
#main #story .content-box + .content-box {
margin: 40px 0 0;
margin: 0 10px;
}
#main #story p + p {
margin: 32px 0 0;
}
#main #story p {
line-height: 1.8;
}
#main #story .box-inner {
position: relative;
margin: 0 0 0 56px;
display: flex;
}
#main #story .box-inner .left {
width: 60%;
}
#main #story .box-inner .right{
width: 30%;
text-align: right;
}
#main #story .box-inner .txt {
margin: 10px 0 0 52px;
}
#main #story .holder {
margin: 64px 0 0;
}
#main #story .arrow {
margin: 24px 0  14px 154px;
} 
#main #story .mid-block {
margin: 56px 0; 
background: url ("images/story_bg.png") no-repeat;
} 
#main #story .mid-block p.tac {
margin: 14px 0  0;
line-height: 1. 8;
} 
#main .grad-btn,  #main .grad-trigger {
display: none;  
} 
#main .illust-1 { 
max-width: 267px; 
width: 100%;
}
#main .illust-2 {
max-width: 392px;
width: 100%;
}
#main .illust-3 {
max-width: 374px;
width: 100%;
}
#main .illust-4 {
max-width: 240px;
width: 100%;
}
#main .illust-5 {
max-width: 342px;
width: 100%;
}
#main .illust-6 {
max-width: 262px;
width: 100%;
}
#main .illust-7 {
position: absolute;
bottom: 10px;
right: 10px;
max-width: 346px;
width: 100%;
}
#main .img-ttl-1 {
width: 254px;
}
#main .img-ttl-2 {
width: 283px;
}
#main .img-ttl-3 {
width: 320px;
}
#main .img-ttl-4 {
width: 237px;
}
#main .img-ttl-5 {
width: 310px;
}
#main .img-ttl-6 {
width: 425px;
}
#main .img-ttl-7 {
width: 251px;
}

#main .balloon-3 {
top: 22px;
right: 94px;
}
#main #expert .bg {
padding: 74px 0 68px;
background: #faf7f4;
}
#main #expert .region {
margin: 44px 0 0;
}
#main #expert h2 {
font-size: 30px;
}
#main #expert .lead {
font-size: 18px;
}
#main #expert .list {
display: inline-flex;
align-items: flex-start;
justify-content: space-between;
width: 100%;
}
#main #expert .list li.item {
margin-top: 160px;
}
#main #expert .list li.item01 {
width: 260px;
}
#main #expert .list li.item02 {
width: 260px;
}
#main #expert .list li.item03 {
width: 414px;
}
#main #expert p.item04 {
margin-top: -140px;
}
#main #voice {
padding: 70px 0;
}
#main #voice .bg {
margin: 30px 0;
padding: 30px;
border: 3px solid #eee;
height: 1000px;
overflow-y: scroll;
}
#main #voice h2 {
height: 104px;
margin: 0;
background: url(../images/feature_ttl.png) no-repeat center;
font-size: 32px;
line-height: 104px;
position: relative;
}
#main #copyright .bg {
padding: 8px 0;
background: #b6afa6;
color: #fff;
font-size: 12px;
}
}