#member-app.app-learning{background:#f0f5ef;color:#203f30;border-top:8px solid #8ca685;border-bottom:1px solid #d4dfd0;padding:70px 6vw 50px}
#member-app .ap-wrap{max-width:1180px;margin:auto}
#member-app .ap-label{font:700 13px/1.8 'Noto Sans JP',sans-serif;color:#52734e;margin:0 0 20px}
#member-app .ap-heading{display:grid;grid-template-columns:1.05fr 1fr;gap:0 6vw;align-items:end;margin-bottom:45px}
#member-app .ap-label{grid-column:1/-1}
#member-app .ap-heading h2{font:700 clamp(33px,3.4vw,49px)/1.5 'Noto Sans JP',sans-serif;letter-spacing:.01em;color:#203f30;margin:0}
#member-app .ap-lead{font:400 14px/2.1 'Noto Sans JP',sans-serif;color:#53694f;margin:0 0 3px}
#member-app .ap-layout{display:grid;grid-template-columns:1fr 1fr;gap:6vw;align-items:start}
#member-app .ap-choices>h3{font:700 15px/1.8 'Noto Sans JP',sans-serif;color:#294b32;margin:0 0 18px}
#member-app .ap-tabs{border-top:1px solid #bdcfb6}
#member-app .ap-tabs>button{display:grid;grid-template-columns:1fr auto;gap:6px 12px;position:relative;appearance:none;background:transparent;color:#566d4e;border:0;border-bottom:1px solid #bdcfb6;width:100%;text-align:left;padding:16px 17px;cursor:pointer}
#member-app .ap-tabs>button[aria-selected=true]{background:#dce9d5;color:#203f30;border-left:4px solid #507743;padding-left:13px}
#member-app .ap-tabs span{grid-column:1;font:400 11px/1.8 'Noto Sans JP',sans-serif;color:#607c56}
#member-app .ap-tabs strong{grid-column:1;font:700 18px/1.8 'Noto Sans JP',sans-serif}
#member-app .ap-tabs b{grid-column:2;grid-row:1/span 2;align-self:center;font:400 20px/1 sans-serif;color:#648157}
#member-app .ap-why{padding:23px 0 0}
#member-app [data-app-reason]{font:700 16px/1.9 'Noto Sans JP',sans-serif;color:#294b32;margin:0 0 13px}
#member-app [data-app-detail]{font:400 13px/2.05 'Noto Sans JP',sans-serif;color:#53694f;margin:0 0 15px}
#member-app .ap-example{font:500 12px/1.95 'Noto Sans JP',sans-serif;color:#48623f;border-left:2px solid #94ab88;padding-left:13px;margin:0}
#member-app .ap-demo{min-width:0;padding-top:2px}
#member-app .ap-screen-top{display:flex;align-items:center;justify-content:space-between;gap:10px;font:500 11px/1.8 'Noto Sans JP',sans-serif;color:#5d7454;margin-bottom:12px}
#member-app .ap-screen-top>button{appearance:none;border:0;background:none;color:#294b32;border-bottom:1px solid #708a64;font:600 12px/1.8 'Noto Sans JP',sans-serif;padding:4px 0;cursor:pointer}
#member-app .ap-screen-window{height:610px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#9eb194 #e5ece0;background:#fff;border:1px solid #d1dec9;border-radius:14px;box-shadow:0 16px 35px #28452c16}
#member-app .ap-screen img{display:block;width:100%;height:auto;max-width:100%}
#member-app #app-panel-video img{margin-top:-135px}
#member-app .ap-screen[hidden]{display:none!important}
#member-app .ap-screen-note{font:400 10px/1.9 'Noto Sans JP',sans-serif;color:#61765a;margin:14px 0 0}
#member-app .ap-cycle{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:25px;align-items:center;margin-top:45px;padding:28px 0;border-top:1px solid #bdcfb6;border-bottom:1px solid #bdcfb6}
#member-app .ap-cycle span{display:block;font:400 11px/1.8 'Noto Sans JP',sans-serif;color:#607c56;margin-bottom:8px}
#member-app .ap-cycle strong{display:block;font:700 16px/1.9 'Noto Sans JP',sans-serif;color:#294b32}
#member-app .ap-cycle>b{font:400 24px/1 sans-serif;color:#76916a}
#member-app .ap-bottom{display:grid;grid-template-columns:1.3fr 1fr;gap:6vw;align-items:center;padding-top:32px}
#member-app .ap-bottom h3{font:700 21px/1.8 'Noto Sans JP',sans-serif;color:#294b32;margin:0 0 13px}
#member-app .ap-bottom p{font:400 12px/2 'Noto Sans JP',sans-serif;color:#53694f;margin:0}
#member-app .ap-bottom>a{display:flex;align-items:center;justify-content:space-between;gap:12px;font:700 13px/1.9 'Noto Sans JP',sans-serif;color:#294b32;text-decoration:none;border-bottom:1px solid #708a64;padding:13px 0}
#member-app .ap-availability{font:400 10px/1.9 'Noto Sans JP',sans-serif;color:#6b7e64;margin:25px 0 0}
#member-app button:focus-visible,#member-app a:focus-visible{outline:3px solid #547648;outline-offset:4px}
#member-app .ap-zoom{border:1px solid #c9d5c1;border-radius:12px;padding:0;width:min(950px,94vw);max-width:94vw;max-height:92vh;background:#fff;color:#203f30;box-shadow:0 25px 70px #0005}
#member-app .ap-zoom:not([open]){display:none}
#member-app .ap-zoom::backdrop{background:#10251de0}
#member-app .ap-zoom-bar{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:16px 22px;background:#edf3e9;border-bottom:1px solid #c9d5c1}
#member-app .ap-zoom-bar h3{font:700 15px/1.8 'Noto Sans JP',sans-serif;margin:0}
#member-app .ap-zoom-bar button{appearance:none;background:#fff;border:1px solid #bacbb1;padding:8px 13px;font:600 13px/1.8 'Noto Sans JP',sans-serif;color:#294b32;cursor:pointer}
#member-app .ap-zoom-scroll{max-height:calc(92vh - 76px);overflow:auto;overscroll-behavior:contain}
#member-app .ap-zoom-scroll img{width:760px;max-width:none;height:auto;display:block;margin:0 auto}
@media(max-width:1000px) and (min-width:769px){#member-app .ap-heading{gap:0 4vw}#member-app .ap-heading h2{font-size:34px}#member-app .ap-lead{font-size:12px}#member-app .ap-layout{gap:4vw}#member-app .ap-tabs strong{font-size:16px}#member-app .ap-screen-window{height:590px}#member-app #app-panel-video img{margin-top:-90px}#member-app .ap-cycle{gap:15px}#member-app .ap-cycle strong{font-size:13px}}
@media(max-width:768px){#member-app.app-learning{padding:45px 24px 38px}#member-app .ap-heading{display:block;margin-bottom:27px}#member-app .ap-label{font-size:11px;margin-bottom:18px}#member-app .ap-heading h2{font-size:32px;line-height:1.6;margin-bottom:22px}#member-app .ap-lead{font-size:12px;line-height:2.1}#member-app .ap-layout{display:flex;flex-direction:column;gap:25px}#member-app .ap-choices{display:contents}#member-app .ap-choices>h3{order:0;font-size:14px;margin:0 0 -9px}#member-app .ap-tabs{order:1;width:100%;display:grid;grid-template-columns:1fr 1fr;gap:0 12px}#member-app .ap-tabs>button{padding:12px 8px;gap:6px 4px;min-height:90px}#member-app .ap-tabs>button[aria-selected=true]{padding-left:6px;border-left-width:2px}#member-app .ap-tabs span{font-size:9px}#member-app .ap-tabs strong{font-size:12px;line-height:1.8}#member-app .ap-tabs b{font-size:14px}#member-app .ap-tabs>button:last-child{grid-column:1/-1;min-height:73px}#member-app .ap-why{order:2;padding:0;width:100%}#member-app [data-app-reason]{font-size:14px;line-height:1.9}#member-app [data-app-detail]{font-size:12px;line-height:2}#member-app .ap-example{font-size:11px}#member-app .ap-demo{order:3;width:100%}#member-app .ap-screen-window{height:470px;border-radius:10px}#member-app #app-panel-video img{margin-top:-90px}#member-app .ap-screen-top{font-size:10px}#member-app .ap-screen-top>button{font-size:11px}#member-app .ap-screen-note{font-size:9px}#member-app .ap-cycle{margin-top:28px;gap:7px;padding:20px 0}#member-app .ap-cycle span{font-size:9px;margin-bottom:6px}#member-app .ap-cycle strong{font-size:11px;line-height:1.9}#member-app .ap-cycle>b{font-size:15px}#member-app .ap-bottom{display:block;padding-top:25px}#member-app .ap-bottom h3{font-size:18px}#member-app .ap-bottom p{font-size:12px}#member-app .ap-bottom>a{font-size:12px;margin-top:19px}#member-app .ap-availability{font-size:10px;margin-top:20px}#member-app .ap-zoom-bar{padding:12px}#member-app .ap-zoom-bar h3{font-size:12px}#member-app .ap-zoom-bar button{font-size:12px;padding:6px 10px}}
@media(max-width:360px){#member-app.app-learning{padding-left:20px;padding-right:20px}#member-app .ap-heading h2{font-size:28px}#member-app .ap-tabs strong{font-size:10px}#member-app .ap-tabs span{font-size:8px}#member-app .ap-tabs>button{padding-left:5px;padding-right:5px}#member-app .ap-screen-window{height:430px}#member-app #app-panel-video img{margin-top:-75px}#member-app .ap-cycle strong{font-size:10px}}
#member-app #app-panel-video img{margin-top:-210px}
@media(max-width:1000px) and (min-width:769px){#member-app #app-panel-video img{margin-top:-115px}}
@media(max-width:768px){#member-app #app-panel-video img{margin-top:-140px}}
@media(max-width:360px){#member-app #app-panel-video img{margin-top:-115px}}
@media(min-width:769px) and (max-width:1023px){#header-inner{padding-left:16px;padding-right:16px}#header-inner>nav{gap:12px}#header-inner>nav>a>span:first-child{font-size:10px;letter-spacing:0;white-space:nowrap}#header-inner>nav>a>span:nth-child(2){font-size:8px;letter-spacing:0;white-space:nowrap}#header-inner>a:first-child{width:70px}#header-inner>a:nth-of-type(2){padding:8px 10px}#header-inner>a:nth-of-type(2)>span{font-size:10px;white-space:nowrap}}
/* v6: show the complete screen as a normal image, with no inner scrolling. */
#member-app.app-learning .ap-demo{width:100%;max-width:390px;margin:0 auto}
#member-app.app-learning .ap-screen-window{height:auto;max-height:none;overflow:visible;overscroll-behavior:auto}
#member-app.app-learning .ap-screen img,#member-app.app-learning #app-panel-video img{margin:0;display:block;width:100%;height:auto;max-width:100%}
#member-app.app-learning .ap-membership{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;margin:0 0 24px;color:#294b32}
#member-app .ap-membership>strong{display:inline-block;background:#294b32;color:#fff;padding:8px 15px;border-radius:3px;font:700 15px/1.7 'Noto Sans JP',sans-serif}
#member-app .ap-membership>span{font:700 15px/1.8 'Noto Sans JP',sans-serif}
@media(max-width:768px){#member-app.app-learning .ap-demo{max-width:360px}#member-app.app-learning .ap-membership{gap:10px 12px;margin-bottom:22px}#member-app .ap-membership>strong{font-size:12px;padding:7px 12px}#member-app .ap-membership>span{font-size:12px}}
@media(min-width:1024px){#member-app.app-learning .ap-demo{max-width:320px}}
