#ability-name-banner{overflow:hidden}#ability-name-banner .banner-container{position:relative;overflow:hidden;width:100%;display:flex;flex-direction:column}@media (min-width: 768px){#ability-name-banner .banner-container{min-height:400px}}@media screen and (max-width: 768px){#ability-name-banner .banner-container{min-height:460px}}#ability-name-banner .banner-background{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1}#ability-name-banner .banner-background img{width:100%;height:100%;object-fit:cover}@media screen and (max-width: 768px){#ability-name-banner .banner-background img{object-position:76% center}}#ability-name-banner .banner-blue-band-container{position:absolute;top:0;left:0;width:100%;height:100%;z-index:2}#ability-name-banner .banner-blue-band-left{position:absolute;top:0;left:0;height:100%;background-color:rgba(26,77,192,0.85)}@media (min-width: 768px){#ability-name-banner .banner-blue-band-left{width:calc(50% - 600px)}}@media screen and (max-width: 768px){#ability-name-banner .banner-blue-band-left{width:0}}#ability-name-banner .banner-blue-band{position:relative;max-width:1200px;margin:0 auto;height:100%;background-color:rgba(26,77,192,0.85)}@media (min-width: 768px){#ability-name-banner .banner-blue-band{clip-path:polygon(0 0, calc(100% - 480px) 0, calc(100% - 240px) 100%, 0 100%)}}@media screen and (max-width: 768px){#ability-name-banner .banner-blue-band{clip-path:polygon(0 0, calc(100% - 40%) 0, calc(100% - 20%) 100%, 0 100%)}}#ability-name-banner .banner-content{width:100%;padding:40px;color:white;position:relative;z-index:3;display:flex;align-items:center;flex:1}@media screen and (max-width: 768px){#ability-name-banner .banner-content{padding:20px}}#ability-name-banner .banner-inner{max-width:1200px;margin:0 auto;width:100%}#ability-name-banner .ability-name{background-color:white;color:#1a4dc0;border-radius:8px;margin:4px}@media (min-width: 768px){#ability-name-banner .ability-name{padding:12px 12px}}@media screen and (max-width: 768px){#ability-name-banner .ability-name{padding:8px 8px;display:block;margin:10px 0;width:fit-content}}#ability-name-banner .banner-top-text{font-weight:bold}@media (min-width: 768px){#ability-name-banner .banner-top-text{font-size:18px;margin-bottom:36px}}@media screen and (max-width: 768px){#ability-name-banner .banner-top-text{font-size:14px;margin-bottom:24px;padding-right:60px}}#ability-name-banner .banner-school-name{font-weight:bold}@media (min-width: 768px){#ability-name-banner .banner-school-name{font-size:18px;margin-bottom:10px}}@media screen and (max-width: 768px){#ability-name-banner .banner-school-name{font-size:14px;margin-bottom:8px;padding-right:33%}}#ability-name-banner .banner-course-title{font-family:'Noto Serif JP';font-weight:bold;text-decoration:underline;text-decoration-color:#FFA500;display:inline-block;width:fit-content}@media (min-width: 768px){#ability-name-banner .banner-course-title{font-size:48px;margin-bottom:20px;text-decoration-thickness:4px;text-underline-offset:16px}}@media screen and (max-width: 768px){#ability-name-banner .banner-course-title{font-size:28px;text-decoration-thickness:3px;text-underline-offset:8px;margin-bottom:24px;padding-right:32%}}@media (min-width: 768px){#ability-name-banner .banner-white-line{display:block;position:relative;top:0;left:0;width:100%;height:0.5px;background-color:white;margin-bottom:24px;margin-top:24px}}@media screen and (max-width: 768px){#ability-name-banner .banner-white-line{display:none}}#ability-name-banner .banner-bottom-container{display:flex;align-items:center;justify-content:space-between;position:relative}@media screen and (max-width: 768px){#ability-name-banner .banner-bottom-container{display:block}}#ability-name-banner .banner-description{font-size:16px;line-height:1.6;position:relative;align-self:flex-start}@media (min-width: 768px){#ability-name-banner .banner-description{max-width:800px;margin-right:20px}}@media screen and (max-width: 768px){#ability-name-banner .banner-description{font-size:13px;margin-bottom:20px;line-height:1.5;padding-right:28%}}@media (min-width: 768px){#ability-name-banner .detail-button-container{text-align:right}}#ability-name-banner .detail-button{display:inline-block;background-color:#FFA500;color:white;padding:17px 24px;border-radius:8px;text-decoration:none;font-weight:bold;white-space:nowrap}@media screen and (max-width: 768px){#ability-name-banner .detail-button{display:block;text-align:center;padding:12px 20px;margin-right:-60px;width:100%}}.head-label-outer{padding-top:64px;position:relative}@media screen and (max-width: 768px){.head-label-outer{padding-top:0}.head-label-outer::before{content:"";position:absolute;top:0;left:-24px;right:-24px;bottom:0;background-color:rgba(51,51,51,0.6)}}.head-label-outer .head-label{display:flex;justify-content:flex-start;align-items:center;border-radius:4px;background-color:rgba(51,51,51,0.6);width:fit-content}@media screen and (max-width: 768px){.head-label-outer .head-label{width:100%;padding:8px;display:block;text-align:center;background-color:transparent}}.head-label-outer .head-label .head-label-title{position:relative;padding-left:12px;padding-right:8px;color:#FFF;font-size:18px;font-weight:700;line-height:160%;z-index:1}@media screen and (max-width: 768px){.head-label-outer .head-label .head-label-title{font-size:14px;line-height:140%}}.head-label-outer .head-label .head-label-sub-title{position:relative;padding-left:8px;padding-right:12px;color:#FFF;font-size:14px;font-weight:500;line-height:160%;z-index:1}@media screen and (max-width: 768px){.head-label-outer .head-label .head-label-sub-title{font-size:12px;line-height:140%}}.head-main{justify-content:flex-start;width:fit-content;width:60%}@media screen and (max-width: 768px){.head-main{width:100%}}.head-main .head-main-title{padding-top:20px;font-size:48px;line-height:130%;font-weight:bold}@media screen and (max-width: 768px){.head-main .head-main-title{padding:24px 0 0 0;text-align:center;font-size:24px}}.head-main .head-hr{margin-top:16px;margin-bottom:16px;border:0;border-top:1px solid #fff}.head-content{font-size:18px;font-weight:bold}@media screen and (max-width: 768px){.head-content{padding:0;text-align:center;font-size:14px}}.head-date{padding-top:4px;font-size:14px}@media screen and (max-width: 768px){.head-date{padding:8px 0 0 0;text-align:center;font-size:12px}}.head-keywords{padding-top:20px;padding-bottom:64px}@media screen and (max-width: 768px){.head-keywords{display:flex;justify-content:center;padding:16px 0 32px 0}}.summary-card{position:relative;background:#fff;border-radius:16px;box-shadow:0 4px 24px rgba(0,0,0,0.08);padding:24px;margin:64px auto 0 auto;max-width:840px;overflow:hidden;background-image:url(/r/reflections/bg-summary-pc.webp);background-repeat:no-repeat;background-position:top right;background-size:auto 100%}@media screen and (max-width: 768px){.summary-card{background-image:url(/r/reflections/bg-summary-sp.webp);margin:32px auto 12px auto;font-size:14px;padding:18px}}.summary-card .summary-card-header{display:flex;align-items:center;margin-bottom:24px}@media screen and (max-width: 768px){.summary-card .summary-card-header{margin-bottom:12px}}.summary-card .summary-card-header .summary-card-icon{width:32px;height:32px;margin-right:12px}@media screen and (max-width: 768px){.summary-card .summary-card-header .summary-card-icon{width:24px;height:24px}}.summary-card .summary-card-header .summary-card-title{font-size:22px;font-weight:bold;letter-spacing:0.02em}@media screen and (max-width: 768px){.summary-card .summary-card-header .summary-card-title{font-size:16px}}.summary-card .summary-card-list{margin:0 0 0 12px;padding-left:24px}.summary-card .summary-card-list li{margin-bottom:12px}@media screen and (max-width: 768px){.summary-card .summary-card-list li{margin-bottom:6px}}.summary-card .summary-card-list li::marker{color:#1847C7;font-size:1.2rem;font-weight:bold}.summary-card .summary-card-list li span{margin-left:6px}.article{padding-top:32px;padding-bottom:64px;margin:0 auto;font-size:16px;line-height:180%;max-width:840px}@media screen and (max-width: 768px){.article{font-size:14px;padding-top:24px;padding-bottom:24px}}.article p{margin-bottom:32px}.article .header-outside{margin:6px 0 0 0;display:flex;align-items:center;justify-content:start;align-items:stretch}.article .header-outside .decoration{width:8px;background-color:#1847C7;border-radius:4px;margin-right:12px}.article .header-outside h2.inside-header{font-size:22px}@media screen and (max-width: 768px){.article .header-outside h2.inside-header{font-size:16px}}.article .permission-from-student{margin-top:32px;color:rgba(0,0,0,0.3)}.what-is-nano{padding-top:64px;padding-bottom:64px;display:flex;justify-content:center;flex-wrap:wrap;max-width:840px;flex:1 1 100%}@media screen and (max-width: 768px){.what-is-nano{flex:1 1 100%;margin-right:0;padding:24px 0 24px 0}}.what-is-nano .what-is-nano-card{position:relative;width:100%;max-width:840px;border-radius:8px;padding:32px;margin:16px;text-align:left;overflow:hidden;white-space:normal;background-color:white;box-shadow:0px 0px 20px 0px rgba(0,0,0,0.16);background-image:linear-gradient(rgba(255,255,255,0.6), rgba(255,255,255,0.6)),url(/r/reflections/bg-what-nano.webp);background-size:cover;background-position:center;object-fit:cover}@media screen and (max-width: 768px){.what-is-nano .what-is-nano-card{width:100%;margin:10px 0;padding:20px 24px}}.what-is-nano .what-is-nano-card .title{display:flex;justify-content:start;align-items:center}.what-is-nano .what-is-nano-card .title .icon{width:32px}@media screen and (max-width: 768px){.what-is-nano .what-is-nano-card .title .icon{width:24px}}.what-is-nano .what-is-nano-card .title .keyword{font-size:22px;font-weight:bold;padding-left:8px}@media screen and (max-width: 768px){.what-is-nano .what-is-nano-card .title .keyword{font-size:16px}}.what-is-nano .what-is-nano-card .description-container{padding-top:24px;display:flex;justify-content:start;align-items:start;gap:24px}@media screen and (max-width: 768px){.what-is-nano .what-is-nano-card .description-container{padding-top:22px;display:block;gap:0}}.what-is-nano .what-is-nano-card .description-container .description-image{width:240px;border-radius:8px}@media screen and (max-width: 768px){.what-is-nano .what-is-nano-card .description-container .description-image{margin-bottom:16px;width:100%}}.what-is-nano .what-is-nano-card .description-container .description{font-size:14px}.what-is-nano .what-is-nano-card .description-container .button-container{display:flex;justify-content:flex-end}@media screen and (max-width: 768px){.what-is-nano .what-is-nano-card .description-container .button-container{display:block;margin-top:16px;width:100%}}.what-is-nano .what-is-nano-card .description-container .button-container .to-nano-button{width:146px;height:48px;margin:16px 8px 0 8px;padding:12px 0;border-radius:8px;text-align:center;cursor:pointer;font-size:14px;font-weight:bold;color:white;background-color:#1847C7}@media screen and (max-width: 768px){.what-is-nano .what-is-nano-card .description-container .button-container .to-nano-button{width:100%;font-size:14px;margin:8px 6px}}.related-articles{padding:0;display:flex;justify-content:center;flex-wrap:wrap}