@charset "UTF-8";


.contents_ymn              { color:#333; font-family: 'Noto Sans JP', sans-serif;}
markar                     { background:linear-gradient(transparent 50%, #ffdc50 50%);}
markar.txb                 { font-weight: bold;}
.sp                        { display: none !important;}
.pc                        { display: block !important;}
.br                        { display: inline !important;}

.no                        { display: none;}
.ta_c                      { text-align: center !important;}

.obi                       { background-color: #ff8850; color: #FFF; padding: 0.5rem; text-align: center; font-size: 1.5rem; font-weight: bold;}
.hd                        { background: url(../images/braincare/hd2.jpg); height: 500px; font-size: 0; line-height: 0; text-indent: -9999px; margin-bottom: 30px;}

.ct01                        { color:#454545; background: url(../images/common/recommend_bg.jpg) center center; padding: 1.5em; margin-top: 30px;}
.ct01 h2                     { text-align: center; font-size: 1.5em; font-weight: bold; border-bottom: 2px dotted #454545; padding-bottom: 0.5em;}
.ct01 ul                     { width: 90%; margin: 1em auto 0; overflow: hidden; box-sizing: border-box; padding-left: 30px; margin-left: 30px;}
.ct01 ul li                  { float: left; width: 55%; font-weight: bold; box-sizing: border-box; padding-left: 30px; margin-bottom: 0.5em; background: url(../images/common/check_bl.png) center left no-repeat; font-size: 1.2em;}
.ct01 ul li:nth-child(1),
.ct01 ul li:nth-child(3)     { width: 45%}
.ct01 ul li:nth-child(5)     { width: 100%;}

.ct02                      { background: url(../images/braincare/ct02.jpg); height: 872px; font-size: 0; line-height: 0; text-indent: -9999px;}

.ct03                      { background-color: #FFF; text-align: center; padding-bottom: 5em; font-size: 20px; line-height: 2em;}
.ct03                      { width: 800px; margin: auto;}
.ct03 h2                   { background: url(../images/braincare/ct03_bg.jpg) center; width: 800px; height: 379px; margin: auto;}
.ct03 h2                   { font-size: 0; line-height: 0; text-indent: -9999px;}
.ct03 img                  { display: block; margin: 2em auto;}

.ct04                      { background: url(../images/braincare/ct04.jpg); height: 644px; font-size: 0; line-height: 0; text-indent: -9999px;}

.ct05                      { background-color: #FFF; text-align: center; font-size: 20px; line-height: 2em;}
.ct05                      { width: 800px; margin: auto;}
.ct05 h2                   { background: url(../images/braincare/ct05_bg---.jpg) center; width: 800px; height: 421px; margin: auto;}
.ct05 h2                   { font-size: 0; line-height: 0; text-indent: -9999px;}
.ct05 ul                   { width: 800px; margin: auto; overflow: hidden; margin: 2em 0;}
.ct05 ul li                { width: 70%; height: 330px; margin: auto;}
.ct05 ul li:nth-child(1)   { background: url(../images/braincare/ct05_02.jpg) left center no-repeat; background-size: cover; border-radius: 50%; display: block;}
.ct05 div                  { width: 800px; text-align: center; box-sizing: border-box; padding: 0 0 8em;}

.ct06                      { background: url(../images/braincare/ct06.jpg); height: 940px; font-size: 0; line-height: 0; text-indent: -9999px;}

.ct07 h2                   { background: url(../images/braincare/ct07_01.jpg) center; height: 400px; margin: auto; font-size: 0; line-height: 0; text-indent: -9999px;}
.ct07 div                  { background: url(../images/braincare/ct07_02.jpg) center; height: 400px; margin: auto; font-size: 0; line-height: 0; text-indent: -9999px;}

.ct08                      { background: url(../images/braincare/ct08_bg.jpg) center; width: 800px; height: 394px; margin: auto;}
.ct08                      { font-size: 0; line-height: 0; text-indent: -9999px;}

.ct09                      { background: url(../images/braincare/ct09_bg.jpg) center; width: 800px; height: 880px; margin: auto; font-size: 20px; line-height: 2em;}
.ct09 div                  { width: 100%; text-align: center; background-color: rgba(0,0,0,0.5); color: #FFF; padding: 2.5em 0;}

.ct11                      { margin: 50px auto; text-align: center; font-size: 20px; line-height: 2em;}
.ct11 strong               { background-color: #379c3e; color: #FFF; font-weight: bold; text-align: center; padding: 0.5rem 4rem; border-radius: 2rem; display: inline-block; margin-bottom: 2rem;}
.ct11 ul                   { background: url(../images/braincare/ct11_02.jpg); height: 315px; font-size: 0; line-height: 0; text-indent: -9999px; margin-top: 50px;}


.ct12                      { background-color: #e9f3d2;}
.ct12                      { width: 800px; margin: auto;}
.ct12 h2                   { background: url(../images/braincare/ct12_ttl.jpg) center; width: 800px; height: 197px; margin: auto;}
.ct12 h2                   { font-size: 0; line-height: 0; text-indent: -9999px;}
.ct12 div                  { padding: 2em 1em; font-size: 20px; line-height: 2em;}
.ct12 div img              { float: left; margin: 0 1em 1em 0; width: 45%;}

.ct13                      { background-color: #e9f3d2;}
.ct13                      { max-width: 800px; margin: 0 auto 50px; padding: 2rem 2rem 4rem 2rem;}
.ct13 h2                   { background: url(../images/braincare/ct13-ttl.png) center; width: auto; height: 135px; font-size: 0; line-height: 0; text-indent: -9999px;}
.ct13 h2 span              { display: block; font-size: 1.5rem; font-weight: bold;}
.ct13 > ul                 { display: flex; justify-content: space-between; gap: 1rem; margin-top: 1.5rem;}
.ct13 > ul > li            { background-color: #fff; border-radius: 1rem; width: 50%; padding: 1.5rem;}
.ct13 > ul > li h3         { font-weight: bold; text-align: center; font-size: 1.5rem;}
.ct13 > ul > li h3 span    { font-size: 1rem; display: block;}
.ct13 > ul > li > ul li    { padding-left: 1.5rem; position: relative;}
.ct13 > ul > li > ul li::before { content: "●"; position: absolute; left: 0; top: 0;}
.ct13 > ul > li p a        { background-color: #379c3e; color: #FFF; text-align: center; display: block; border-radius: .3rem; margin-top: 1rem; padding: .3rem; font-weight: bold;}
.ct13 > ul > li img        { display: block; margin: auto;}

.cart .box    { clear: both;}
.cart .box img    { float: left; width: 40px; margin-right: 1rem; margin-left: 1rem;}

@media screen and (max-width:480px) {

.pc                        { display: none !important;}
.sp                        { display: block !important;}

.contents_ymn              { color:#333; font-size: 4.3vw !important; line-height: 1.7em;}

.obi                       { font-size: 1.2rem; }
.hd                        { background: url(../images/braincare/hd2-sp.jpg) top no-repeat; background-size: 100% auto; height: 65vw; font-size: 0; line-height: 0; text-indent: -9999px; margin-bottom: 30px;}

.ct01                        { background: url(../images/common/recommend_bg.jpg) center center; padding: 1.5em; margin-top: 30px;}
.ct01 h2                     { font-size: 1.3em; }
.ct01 ul                     { width: auto; margin: 1em auto 0; overflow: hidden; box-sizing: border-box; padding-left: 0px; margin-left: 0px;}
.ct01 ul li                  { float: none; width: 100%; font-weight: bold; box-sizing: border-box; padding-left: 8vw; margin-bottom: 0.5em; background-position: left 0.2em; -webkit-background-size: 5.8vw auto; background-size: 5.8vw auto; font-size: 1.1em;}
.ct01 ul li:nth-child(1),
.ct01 ul li:nth-child(3)     { width: 100%}

.ct02                      { background: url(../images/braincare/ct02.jpg) center top; background-size: 120%; height: 130vw; font-size: 0; line-height: 0; text-indent: -9999px;}

.ct03                      { background-color: #FFF; text-align: left; padding-bottom: 1em; font-size: 4.3vw !important;}
.ct03                      { width: auto; margin: auto;}
.ct03 h2                   { background: url(../images/braincare/ct03_bg-sp.jpg) center bottom no-repeat; background-size: 100% auto; width: auto; height: 80vw; margin: auto;}
.ct03 p                    { padding: 0 2.5em;}
.ct03 br                   { display: none;}
.ct03 img                  { width: 100%;}

.ct04                      { background: url(../images/braincare/ct04-sp.jpg); background-size: 100% auto; height: 100vw;}


.ct05                      { width: auto; margin: auto; font-size: 4.3vw !important; margin-top: 2em;}
.ct05 h2                   { background: url(../images/braincare/ct05_bg-sp.jpg) center bottom no-repeat; background-size: 100% auto; width: auto; height: 75vw;}
.ct05 ul                   { width: auto; width: 100%; margin-top: 3em;}
.ct05 ul li                {  height: 50vw;}
.ct05 div                  { background: transparent; width: auto; height: auto; padding-top: 0; padding-bottom: 3rem;}
.ct05 p                    { padding: 0 2.5em; text-align: left;}
.ct05 br                   { display: none;}

.ct06                      { background: url(../images/braincare/ct06sp.jpg) top no-repeat; background-size: 100% auto; height: 120vw;}

.ct07 h2                   { background: url(../images/braincare/ct07_01sp.jpg) center top; background-size: 100% auto; height: 55vw; margin: auto; font-size: 0; line-height: 0; text-indent: -9999px;}
.ct07 div                  { background: url(../images/braincare/ct07_02sp.jpg) center top no-repeat; background-size: 120% auto; height: 105vw; margin: 7vw auto 10vw; font-size: 0; line-height: 0; text-indent: -9999px;}

.ct08                      { background: url(../images/braincare/ct08_bg-sp.jpg) center top no-repeat #e5f6fd; background-size: 100% auto; width: auto; height: 81vw; }

.ct09                      { background: url(../images/braincare/ct09_bg-sp.jpg) center bottom no-repeat; background-size: 100% auto; width: auto; height: 130vw;}
.ct09 div                  { text-align: left; padding: 1.5em 2em; width: auto; font-size: 4vw !important; line-height: 1.9em !important;}
.ct09 div br   { display: none;}


.ct11                      { padding-top: 10vw; margin: auto; text-align: left; font-size: 4vw; line-height: 2em; margin-bottom: 50px;}
.ct11 strong               { display: block; font-size: 1.2rem; padding: 0.5rem;}
.ct11 ul                   { background: url(../images/braincare/ct11_02sp.jpg) center top; background-size: 100% auto; height: 47vw; font-size: 0; line-height: 0; text-indent: -9999px; margin-top: 50px;}



.ct12                      { background-color: #e9f3d2; }
.ct12                      { width: auto; }
.ct12 h2                   { background: url(../images/braincare/ct12_ttl-sp.jpg) center ; background-size: 100% auto; width: auto; height: 30vw;}
.ct12 div                  { width: auto; margin: auto; padding: 2em 2em; font-size: 4.3vw !important;}
.ct12 div img              { float: none; margin: 0 0 1em 0; display: block; width: 100%;}



.ct13                      { max-width: 800px; margin: 0 auto 50px; padding: 2rem 1rem 3rem 1rem;}
.ct13 h2                   { background-size: cover; width: auto; height: 70px;}
.ct13 > ul                 { flex-direction: column; gap: 1rem; }
.ct13 > ul > li            { width: 100%; padding: 1.5rem;}
.ct13 > ul > li h3         { font-weight: bold; text-align: center; font-size: 1.5rem;}
.ct13 > ul > li h3 span    { font-size: 1rem; display: block;}
.ct13 > ul > li > ul li    { padding-left: 1.5rem; position: relative;}
.ct13 > ul > li > ul li::before { content: "●"; position: absolute; left: 0; top: 0;}
.ct13 > ul > li p a        { background-color: #379c3e; color: #FFF; text-align: center; display: block; border-radius: .3rem; margin-top: 1rem; padding: .3rem; font-weight: bold;}
.ct13 > ul > li img        { display: block; margin: auto;}


.cart .box img    { float: left; width: 40px !important; margin-right: 1rem; margin-left: 0;}

}