@charset "UTF-8";

/* fv
-------------------------------*/
.fv { position: relative; height: 100svh; }
.fv__inner { position: relative; display: flex; flex-direction: column; justify-content: space-between; width: 100%; height: 100%; background: url("../img/home/bg_fv_sp.jpg") no-repeat center/cover; }
.fv__inner::before { position: absolute; left: 0; bottom: 0; display: block; width: 100%; height: 230px; background: url("../img/home/gra_fv_sp.png") repeat-x 0 100%/1px auto; pointer-events: none; content: ""; z-index: 0; }

.fv__ttl { width: 53.35vw; background: #fff; margin-left: 6.4vw; }
.fv__catch picture { display: block; }
.fv__bnr { position: relative; display: block; }
@media screen and (max-width: 680px) {
	.fv__inner { padding-top: 19.3vw; padding-bottom: 4.2vw; }
	.fv__catch { position: relative; flex: 1; align-content: flex-end; width: 98.4vw; aspect-ratio: 368/194; }
	.fv__catch { left: 50%; transform: translateX(-50%); }
	.fv__bnr { width: calc(100% - 48px); margin-top: 4.2vw; margin-left: auto; margin-right: auto; }
}
@media screen and (min-width: 681px) {
	.fv { height: 100vh; }
	.fv__inner::before { height: 210px; background-image: url("../img/home/gra_fv_pc.png") }
	.fv__inner { background-image: url("../img/home/bg_fv_pc.jpg"); padding-bottom: 18px; }
	.fv__ttl { width: 340px; margin-top: 120px; margin-left: 50px; }
	.fv__catch { position: relative; flex: 1; justify-content: center; align-content: flex-end; text-align: center; }
	.fv__catch img { width: 1309px; aspect-ratio: 1309/235; }
	.fv__bnr { position: absolute; transition: .4s; bottom: 238px; right: 50px; width: 160px; aspect-ratio: 1/1; }
	.fv__bnr:hover { filter: brightness(120%); }
}
@media screen and (min-width: 1401px) {
	.fv__inner { padding-bottom: 1.3vw; }
	.fv__ttl { width: 24.3vw; margin-top: 8.55vw; margin-left: 3.55vw; }
	.fv__catch img { width: 93.5vw; }
	.fv__bnr { bottom: 17.3vw; right: 3.5vw; width: 11.4vw; }
}


/*  for iPhone SE  */
@media screen and (max-width: 375px) and (max-height: 554px) {
	.fv { min-height: 700px; }
}

@media (hover: hover) and (pointer: fine) and (max-height: 800px) {
	.fv { min-height: 788px; }
}


/* Concept Upper
-------------------------------*/
.sec--concept { position: relative; background: url("../img/home/bg_concept_sp.jpg") no-repeat 50% 50%/cover; padding-top: 150px; padding-bottom: 520px; }
.sec--concept::before { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; background: var(--c-dgreen); opacity: .7; mix-blend-mode: multiply; content: ""; z-index: 0; pointer-events: none; }
.concept-deco { position: absolute; top: 0; left: 50%; transform: translateX(-50%); display: block; width: 100%; background: var(--c-mustard); pointer-events: none; }
.concept-deco--1,
.concept-deco--2 { height: 120px; mix-blend-mode: multiply; opacity: .4; z-index: 1; }
.concept-deco--1 { clip-path: polygon(0 0, 0% 100%, 100% 0); }
.concept-deco--2 { clip-path: polygon(0 0, 100% 100%, 100% 0); }
.concept-deco--3 { height: 60px; background: var(--c-mustard); clip-path: polygon(0 0, 50% 100%, 100% 0); z-index: 2; }

.concept-scr { position: absolute; top: 20px; left: 50%; transform: translateX(-50%); display: block; width: 1px; height: 74px; background-color: #fff; z-index: 10; }
.concept-scr::before { position: absolute; left: 50%; transform: translateX(-50%); display: block; width: 8px; height: 8px; background-color: #fff; border-radius: 50%; content: ""; animation: concept-scroll 2s cubic-bezier(0.65, 0, 0.35, 1) infinite; }

.concept-upper { text-align: center; color: #fff; }
.concept-upper__ttl { font-size: 3.8rem; font-weight: 500; line-height: 1.4; letter-spacing: 0.05em; }
.concept-upper__txt { margin-top: 27px; font-size: 1.4rem; line-height: 1.75; }
.concept-upper__btn { position: relative; display: flex; justify-content: center; align-items: center; width: calc(100% - 47px); height: 60px; background: var(--c-mustard); margin: 24px auto 0; font: 400 2.0rem var(--ff-grmd); line-height: 1; letter-spacing: 0.08em; text-indent: 0.08em; color: #fff; }
.concept-upper__btn::before { position: absolute; top: 50%; right: 20px; transform: translateY(-75%) rotate(135deg); transform-origin: center; width: 12px; height: 12px; border-right: 2px solid #fff; border-top: 2px solid #fff; content: ""; opacity: .5; }
@media screen and (max-width: 680px) {
	.concept-upper__ttl { text-indent: -0.3em; }
}
@media screen and (min-width: 681px) {
	.sec--concept { background-image: url("../img/home/bg_concept_pc.jpg"); padding-top: 307px; padding-bottom: 554px; }
	.concept-deco--1, .concept-deco--2 { height: 240px; }
	.concept-deco--3 { height: 120px; }
	.concept-scr { top: 54px; height: 192px; }
	.concept-upper__ttl { font-size: 6.4rem; line-height: 1; letter-spacing: 0.08em; text-indent: 1em; }
	.concept-upper__txt { margin-top: 67px; font-size: 1.8rem; line-height: 2; }
	.concept-upper__btn { transition: .4s; max-width: 318px; height: 65px; margin-top: 26px; }
	.concept-upper__btn:hover { filter: brightness(110%); }
}
@media screen and (min-width: 1401px) {
	.sec--concept { background-image: url("../img/home/bg_concept_lpc.jpg"); }
}


/* Concept Lower
-------------------------------*/
.concept-lower { margin-top: 78px; color: #fff; }
.concept-lower__ttl { font-size: 3.0rem; font-weight: 500; line-height: 1.34; text-align: center; }
.concept-lower__inner { margin-top: 81px; }
.concept-lower__catch { position: relative; }
.concept-lower__catch::before { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; width: 180px; aspect-ratio: 1/1; background: url("../img/home/obj_concept_lower_catch.png") no-repeat center/contain; content: ""; opacity: .3; }
.concept-lower__catch__jp,
.concept-lower__catch__en { display: block; text-align: center; }
.concept-lower__catch__jp { font-size: 3.0rem; font-weight: 500; line-height: 1; }
.concept-lower__catch__en { margin-top: 18px; font: 500 1.4rem var(--ff-grmd); line-height: 1; letter-spacing: 0.4em; text-indent: 0.4em; }
.concept-wrap { position: relative; display: grid; grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(3, 1fr); grid-column-gap: 12px; grid-row-gap: 30px; margin-top: 81px; }
.concept-wrap::before { position: absolute; top: calc(100% + 38px); left: 50%; transform: translateX(-50%); display: block; width: 142px; aspect-ratio: 178/52; background: url("../img/home/obj_concept_arrow.png") no-repeat center/contain; content: ""; }
.concept { position: relative; align-content: center; background: rgba(80,165,150,0.7); border-radius: 10px; padding: 20px 0 21px; font-size: 1.6rem; font-weight: 600; line-height: 1.4375; text-align: center; }
.concept__label { position: absolute; bottom: calc(100% - 6px); left: 50%; transform: translateX(-50%); display: flex; justify-content: center; align-items: flex-end; font: 500 2.4rem var(--ff-grmd); font-style: italic; line-height: 1; }
.concept__label::before { content: "ISSUE"; margin-right: 10px; font-size: 70%; }
@media screen and (max-width: 680px) {
	.concept-lower__ttl span { position: relative; display: inline-block; }
	.concept-lower__ttl span::before { position: absolute; left: 50%; transform: translateX(-50%); bottom: 5px; display: block; width: calc(100% + 40px); height: 1px; background: #fff; content: ""; }
	.concept-lower__catch__jp { white-space: nowrap; }
}
@media screen and (min-width: 681px) {
	.concept-lower { margin-top: 116px; color: #fff; }
	.concept-lower__ttl { border-bottom: 1px solid #fff; font-size: 4.8rem; line-height: 1; letter-spacing: 0.05em; }
	.concept-lower__inner { position: relative; margin: 81px -150px 0; }
	.concept-lower__catch { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
	.concept-lower__catch::before { transform: translate(-50%, -52%); width: 305px; }
	.concept-lower__catch__jp { font-size: 4.0rem; }
	.concept-lower__catch__en { margin-top: 16px; font-size: 1.8rem;letter-spacing: 0.84em; text-indent: 0.84em; }
	.concept-wrap { position: relative; grid-column-gap: 420px; grid-row-gap: 56px; margin-top: 96px; }
	.concept-wrap::before { top: calc(100% + 62px); width: 178px; }
	.concept { position: relative; width: 340px; height: 112px; border-radius: 56px; padding: 0; font-size: 2.0rem; line-height: 1.4; }
	.concept:nth-of-type(1) { grid-area: 1 / 1 / 2 / 2; }
	.concept:nth-of-type(2) { grid-area: 2 / 1 / 3 / 2; }
	.concept:nth-of-type(3) { grid-area: 3 / 1 / 4 / 2; }
	.concept:nth-of-type(4) { grid-area: 1 / 2 / 2 / 3; }
	.concept:nth-of-type(5) { grid-area: 2 / 2 / 3 / 3; }
	.concept:nth-of-type(6) { grid-area: 3 / 2 / 4 / 3; }
	.concept:nth-of-type(1),
	.concept:nth-of-type(3),
	.concept:nth-of-type(5) { margin-left: 100px; }
	.concept:nth-of-type(4),
	.concept:nth-of-type(6) { margin-right: 100px; }
	.concept__label { bottom: calc(100% - 7px); font-size: 3.2rem; }
	
	.concept::before { position: absolute; display: block; background-repeat: no-repeat; background-position: center; background-size: contain; content: ""; }
	.concept:nth-of-type(1)::before,
	.concept:nth-of-type(2)::before,
	.concept:nth-of-type(3)::before { left: calc(100% - 20px); }
	.concept:nth-of-type(4)::before,
	.concept:nth-of-type(5)::before,
	.concept:nth-of-type(6)::before { right: calc(100% - 20px); }
	.concept:nth-of-type(1)::before,
	.concept:nth-of-type(4)::before { top: 50px; }
	.concept:nth-of-type(3)::before,
	.concept:nth-of-type(6)::before { bottom: 50px; }
	.concept:nth-of-type(1)::before,
	.concept:nth-of-type(6)::before { width: 62px; height: 27px; }
	.concept:nth-of-type(1)::before { background-image: url("../img/home/obj_line_concept_1.png"); }
	.concept:nth-of-type(6)::before { right: calc(100% - 20px); background-image: url("../img/home/obj_line_concept_6.png"); }
	
	.concept:nth-of-type(2)::before,
	.concept:nth-of-type(5)::before { top: 50%; transform: translateY(-50%); width: 80px; height: 8px; }
	.concept:nth-of-type(2)::before { background-image: url("../img/home/obj_line_concept_2.png"); }
	.concept:nth-of-type(5)::before { background-image: url("../img/home/obj_line_concept_5.png"); }
	.concept:nth-of-type(3)::before { width: 154px; height: 120px; background-image: url("../img/home/obj_line_concept_3.png"); }
	.concept:nth-of-type(4)::before { width: 135px; height: 100px; background-image: url("../img/home/obj_line_concept_4.png"); }
}


/* Vision
-------------------------------*/
.sec--vision { background: url("../img/home/ptn_dot_wave.png") repeat center/182px 170px; padding-bottom: 37px; }
.sec--vision .l-wrapper { margin-top: -408px; }
.vision-ttl { margin-bottom: 20px; font-size: 2.4rem; font-weight: 500; line-height: 1.583; letter-spacing: 0.02em; text-indent: 0.02em; text-align: center; color: #fff; }
.vision { background: #fff; border-radius: 10px; padding: 28px 40px 30px; }
.vision__label { position: relative; left: 50%; transform: translateX(-50%); display: inline-flex; flex-direction: column; align-items: center; }
.vision__label::before,
.vision__label::after { position: absolute; top: 50%; transform: translateY(-60%); display: block; width: 30px; height: 60px; background-repeat: no-repeat; background-position: center; background-size: contain; content: ""; }
.vision__label::before { right: calc(100% + 5px); background-image: url("../img/home/obj_wheet_l.png"); }
.vision__label::after { left: calc(100% + 5px); background-image: url("../img/home/obj_wheet_r.png"); }
.vision__label__jp, .vision__label__en { text-align: center; }
.vision__label__jp { font-size: 2.0rem; font-weight: 500; line-height: 1; letter-spacing: 0.05em; text-indent: 0.05em; }
.vision__label__en { margin-top: 13px; font: 500 1.8rem var(--ff-grmd); line-height: 1; letter-spacing: 0.2em; text-indent: 0.2em; }
.vision__btn-wrap { display: flex; margin-top: 35px; }
.vision__btn { position: relative; display: flex; flex-direction: column; align-items: center; width: 247px; aspect-ratio: 1/1; background: var(--c-dgreen); border-radius: 50%; padding-top: 39px; text-align: center; color: #fff; }
.vision__btn::before { position: absolute; bottom: 32px; left: 50%; transform: translateX(-50%) rotate(135deg); transform-origin: center; width: 12px; height: 12px; border-right: 2px solid #fff; border-top: 2px solid #fff; content: ""; opacity: .5; }
.vision__btn__label { position: relative; margin-bottom: 42px; font: 400 1.4rem var(--ff-grmd); line-height: 1; letter-spacing: 0.05em; text-indent: 0.05em; }
.vision__btn__label::before { position: absolute; top: calc(100% + 16px); left: 50%; transform: translateX(-50%); width: 18px; height: 2px; background: #fff; border-radius: 1px; content: ""; }
.vision__btn__txt { font: 600 3.0rem var(--ff-nose); line-height: 1.46; letter-spacing: 0.04em; text-indent: 0.04em; }
.vision__btn__txt__sm { display: block; font-size: 70%; }
@media screen and (max-width: 680px) {
	.vision-ttl { margin-left: -24px; margin-right: -24px; white-space: nowrap; }
	.vision__btn-wrap { flex-direction: column; align-items: center; }
	.vision__btn:not(:first-of-type) { margin-top: 15px; }
}
@media screen and (min-width: 681px) {
	.sec--vision { padding-bottom: 80px; }
	.sec--vision .l-wrapper { margin-top: -382px; }
	.vision-ttl { margin-bottom: 10px; font-size: 4.0rem; line-height: 1.75; letter-spacing: 0.04em; text-indent: 0.04em; }
	.vision { padding: 48px 50px 50px; }
	.vision__label::before,
	.vision__label::after { width: 47px; height: 96px; }
	.vision__label::before { right: calc(100% + 20px); }
	.vision__label::after { left: calc(100% + 20px); }
	.vision__label__jp { font-size: 3.2rem; letter-spacing: 0.3em; text-indent: 0.3em; }
	.vision__label__en { margin-top: 16px; font-size: 2.0rem; letter-spacing: 0.44em; text-indent: 0.44em; }
	.vision__btn-wrap { justify-content: space-between; margin-top: 42px; }
	.vision__btn { transition: .4s; width: 280px; }
	.vision__btn:hover { filter: brightness(110%); }
	.vision__btn::before { bottom: 36px; }
	.vision__btn__label { margin-bottom: 46px; font-size: 1.6rem; }
	.vision__btn__label::before { width: 22px; }
	.vision__btn__txt { font-size: 3.6rem; line-height: 1.34; }
}


/* Common Things
-------------------------------*/
.cmnttl { position: relative; text-align: center; }
.cmnttl__en,
.cmnttl__jp { display: block; }
.cmnttl__en { font: 400 1.6rem var(--ff-grmd); line-height: 1; letter-spacing: 0.12em; text-indent: 0.12em; color: var(--c-mustard); }
.cmnttl__jp { margin-top: 1px; font-size: 3.6rem; font-weight: 600; line-height: 1.5; letter-spacing: 0.02em; text-indent: 0.02em; color: var(--c-dgreen); }
.cmnttl__deco { position: absolute; top: calc(100% + 13px); left: 50%; transform: translateX(-50%); display: block; width: 32px; height: 32px; overflow: hidden; pointer-events: none; }
.cmnttl__deco::before { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) rotate(-45deg); display: block; width: 120%; height: 1px; background: var(--c-dgreen); content: ""; }
@media screen and (max-width: 680px) {
	
}
	@media screen and (min-width: 681px) {
	.cmnttl__en { font-size: 2.4rem; }
	.cmnttl__jp { margin-top: -2px; font-size: 4.8rem; line-height: 1.458; letter-spacing: 0.2em; text-indent: 0.2em; }
	.cmnttl__deco { top: calc(100% + 19px); width: 40px; height: 40px; }
}


/* Message
-------------------------------*/
.sec--msg { background: #f5f5f5; padding-top: 60px; padding-bottom: 88px; }
.msg { margin-top: 81px; }
.msg__ttl { margin-bottom: 29px; font-size: 2.0rem; font-weight: 500; line-height: 1; text-align: center; }
.msg__ttl::before { content: "［"; margin-right: 5px; }
.msg__ttl::after { content: "］"; margin-left: 5px; }
.mgs__video-wrap { display: grid; grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(2, auto); grid-column-gap: 25px; grid-row-gap: 25px; }
.mgs__video {  }
@media screen and (max-width: 680px) {
	.msg__ttl { margin-left: -24px; margin-right: -24px; }
}
@media screen and (min-width: 681px) {
	.sec--msg { padding-top: 87px; padding-bottom: 120px; }
	.msg { margin-top: 133px; }
	.msg__ttl { margin-bottom: 41px; font-size: 3.2rem; letter-spacing: 0.2em; text-indent: 0.2em; }
	.msg__ttl::before { margin-right: 10px; }
	.msg__ttl::after { margin-left: 10px; }
	.mgs__video-wrap { grid-column-gap: 30px; grid-row-gap: 30px; }
	.mgs__video-wrap .mgs__video { transition: .4s; height: 260px; }
	.mgs__video:hover { filter: brightness(110%); }
}


/* Field
-------------------------------*/
.sec--field { padding-top: 73px; padding-bottom: 88px; }
.field-intro {  }
.field-intro__ttl { font-size: 3.2rem; font-weight: 600; line-height: 1.75; text-align: center; color: var(--c-dgreen); }
.field-intro__txt { margin-top: 15px; font-size: 1.6rem; line-height: 1.75; text-align: center; }
.field-wrap { margin-top: 69px; }
.field {  }
.field__inner { position: relative; margin-bottom: 20px; }
.field__vege { position: absolute; width: auto; height: 216px; opacity: .2; pointer-events: none; z-index: 0; }

.field__ttl,
.field__label,
.field__catch { position: relative; z-index: 10; }
.field__ttl { font-size: 6.4rem; font-weight: 700; line-height: 1; }
.field__label { display: flex; justify-content: center; align-items: center; height: 56px; margin-top: 21px; font-size: 2.4rem; font-weight: 600; line-height: 1; text-align: center; color: #fff; }
.field__catch { margin-top: 15px; font-size: 2.8rem; font-weight: 600; line-height: 1.5; text-align: left; }
.field__txt-wrap { position: relative; transition: .4s; width: 100%; min-height: 56px; border-style: solid; border-width: 0; border-radius: 10px; }

.field__trg { position: absolute; left: 50%; transform: translateX(-50%); bottom: 0; display: flex; justify-content: center; align-items: center; width: 100%; height: 56px; background: #fff; border-style: solid; border-width: 2px; border-radius: 10px; cursor: pointer; transition: 0.4s; }
.field__trg::before { content: "もっと見る"; font: 500 1.6rem var(--ff-nose); line-height: 1; }
.field__trg__icon { position: absolute; top: 50%; transform: translateY(-50%); right: 20px; display: block; width: 16px; height: 16px; }
.field__trg__icon::before,
.field__trg__icon::after { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); transition: .4s; display: block; content: ""; }
.field__trg__icon::before { width: 100%; height: 2px; }
.field__trg__icon::after { width: 2px; height: 100%; }
.field__txt { font-size: 1.4rem; font-weight: 500; line-height: 1.75; text-align: justify; }
.field__txt-wrap.is-open { border-width: 2px; }
.field__txt-wrap.is-open .field__trg { bottom: -20px; width: calc(100% - 87px); height: 40px; border-radius: 20px; }
.field__txt-wrap.is-open .field__trg::before { content: "とじる"; }
.field__txt-wrap.is-open .field__trg__icon::after { height: 0; }

.field--agri .field__ttl,
.field--agri .field__catch { color: var(--c-lgreen); }
.field--agri .field__label { background-color: var(--c-lgreen); }
.field--agri .field__vege { top: -24px; right: -50px; }
.field--agri .field__txt-wrap,
.field--agri .field__trg { border-color: var(--c-lgreen); }

.field--agri .field__trg__icon::before,
.field--agri .field__trg__icon::after { background: var(--c-lgreen); }

.field--soci .field__ttl,
.field--soci .field__catch { color: var(--c-orange); }
.field--soci .field__label { background-color: var(--c-orange); }
.field--soci .field__vege { top: -68px; right: -11px; }
.field--soci .field__txt-wrap,
.field--soci .field__trg { border-color: var(--c-orange); }
.field--soci .field__trg__icon::before, .field--soci .field__trg__icon::after { background: var(--c-orange); }

.field--food .field__ttl,
.field--food .field__catch { color: var(--c-blue); }
.field--food .field__label { background-color: var(--c-blue); }
.field--food .field__vege { top: -48px; right: -49px; }
.field--food .field__txt-wrap,
.field--food .field__trg { border-color: var(--c-blue); }
.field--food .field__trg__icon::before, .field--food .field__trg__icon::after { background: var(--c-blue); }


@media screen and (max-width: 680px) {
	.field-intro__txt,
	.field__label { margin-left: -24px; margin-right: -24px; }
	.field__catch { margin-right: -24px; }
	.field:not(:first-of-type) { margin-top: 52px; }
	.field__txt { display: none; padding: 18px 30px 33px; }
}
@media screen and (min-width: 681px) {
	
	.sec--field { padding-top: 103px; padding-bottom: 118px; }
	.field-intro {  }
	.field-intro__ttl { font-size: 5.6rem; line-height: 1.5; letter-spacing: 0.34em; text-indent: 0.34em; }
	.field-intro__txt { margin-top: 37px; font-size: 1.8rem; letter-spacing: 0.02em; text-indent: 0.02em; }
	.field-wrap { display: grid; grid-template-columns: 1fr 1px 1fr 1px 1fr; grid-template-rows: 1fr; grid-column-gap: 35px; grid-row-gap: 0px; margin-top: 114px; margin-left: -100px; margin-right: -100px; }
	
	.field-wrap::before,
	.field-wrap::after { content: ""; background: #dcdcdc; }
	.field-wrap::before { grid-area: 1 / 2 / 2 / 3; }
	.field-wrap::after { grid-area: 1 / 4 / 2 / 5; }
	
	.field { padding-top: 98px; }
	.field--agri { grid-area: 1 / 1 / 2 / 2; }
	.field--soci { grid-area: 1 / 3 / 2 / 4; }
	.field--food { grid-area: 1 / 5 / 2 / 6; } 
	
	.field {  }
	.field__inner { margin-bottom: 28px; }
	.field__vege { height: 270px; }

	.field__ttl { font-size: 8.0rem; }
	.field__label { border-radius: 28px; margin-top: 29px; }
	.field__catch { margin-top: 31px; letter-spacing: 0.02em; text-indent: 0.02em; text-align: center; }
	.field__txt-wrap {  }
	.field__trg { display: none; }
	.field__txt { font-size: 1.6rem; }
	
	.field--agri .field__vege { top: -153px; right: -25px; }
	.field--soci .field__vege { top: -142px; right: -18px; }
	.field--food .field__vege { top: -132px; right: -11px; }
}


/* Curriculum
-------------------------------*/
.sec--crcl { position: relative; background: var(--c-mustard); padding-top: 52px; padding-bottom: 50px; }
.sec--crcl::before { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; background: url("../img/home/ptn_crcl_sp.png") no-repeat center/680px auto; content: ""; opacity: .3; mix-blend-mode: color-burn; }
.crcl-ttl {  }
.crcl-ttl__en,
.crcl-ttl__jp { display: block; text-align: center; }
.crcl-ttl__en { font: 400 3.0rem var(--ff-grmd); line-height: 1; letter-spacing: 0.2em; text-indent: 0.2em; color: #fff; }
.crcl-ttl__jp { margin-top: 9px; font-size: 3.2rem; font-weight: 600; line-height: 1.5; letter-spacing: 0.1em; text-indent: 0.1em; color: #222; }
.crcl-txt { margin: 26px 0 34px; font-size: 1.6rem; line-height: 1.75; text-align: center; }
.crcl-btn { position: relative; display: flex; justify-content: center; align-items: center; width: calc(100% - 47px); height: 60px; background: #000; margin-left: auto; margin-right: auto; font-size: 1.6rem; line-height: 1; letter-spacing: 0.02em; text-indent: 0.02em; text-align: center; color: #fff; }
.crcl-btn::before { position: absolute; right: 20px; top: 50%; transform: translateY(-70%) rotate(135deg); transform-origin: center; width: 14px; height: 14px; border-right: 2px solid #fff; border-top: 2px solid #fff; content: ""; opacity: .5; }
@media screen and (max-width: 680px) {
	
}
@media screen and (min-width: 681px) {
	.sec--crcl { padding-top: 63px; padding-bottom: 64px; }
	.sec--crcl::before { background-image: url("../img/home/ptn_crcl_pc.png"); background-size: cover; }
	.crcl-ttl {  }
	.crcl-ttl__en { font-size: 5.6rem; letter-spacing: 0.36em; text-indent: 0.36em; }
	.crcl-ttl__jp { margin-top: 3px; font-size: 4.8rem }
	.crcl-txt { margin: 23px 0 44px; font-size: 1.8rem; }
	.crcl-btn { transition: .4s; width: 300px; font-size: 2.0rem; }
	.crcl-btn:hover { color: var(--c-mustard); }
}


/* Qualification and Career Path
-------------------------------*/
.sec--qnc { background: #ebf4ec; padding-top: 60px; padding-bottom: 88px; }
.qnc-wrap { margin-top: 80px; }
.qnc {  }
.qnc:not(:first-of-type) { margin-top: 52px; }
.qnc__ttl { position: relative; display: flex; margin-bottom: 25px; padding-bottom: 24px; color: var(--c-dgreen); }
.qnc__ttl__main { font-size: 3.0rem; line-height: 1; letter-spacing: 0.02em; text-indent: 0.02em; }
.qnc__ttl__sub { font-size: 1.8rem; line-height: 1; }
.qnc__ttl::before,
.qnc__ttl::after { position: absolute; left: 50%; transform: translateX(-50%); display: block; background: var(--c-dgreen); content: ""; }
.qnc__ttl::before { bottom: -1px; width: 48px; height: 3px; }
.qnc__ttl::after { bottom: 0; width: 100%; height: 1px; }
.qnc__catch { font-size: 1.6rem; line-height: 1.75; text-align: center; color: var(--c-dgreen); }


.qnc__q-wrap { margin-top: 35px; }
.qnc__q {  }
.qnc__q__label { display: flex; justify-content: center; align-items: center; height: 40px; background: var(--c-green); border-radius: 6px; padding-bottom: 2px; font: 500 1.8rem var(--ff-nosa); line-height: 1; text-align: center; color: #fff; }
.qnc__q__list-wrap { display: grid; grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(4, 1fr); grid-column-gap: 0px; grid-row-gap: 5px; margin-top: 14px; }
.qnc__q__list { display: flex; align-items: center; font: 400 1.4rem var(--ff-nosa); line-height: 1.2; }
.qnc__q__list::before { content: "\025cf"; font-size: 70%; }
.qnc__q__list sup { font-size: 70%; }

.qnc__q--nat .qnc__q__list:nth-of-type(1) { grid-area: 1 / 1 / 2 / 2; }
.qnc__q--nat .qnc__q__list:nth-of-type(2) { grid-area: 1 / 2 / 2 / 3; }
.qnc__q--nat .qnc__q__list:nth-of-type(3) { grid-area: 2 / 1 / 3 / 2; }
.qnc__q--nat .qnc__q__list:nth-of-type(4) { grid-area: 2 / 2 / 3 / 3; }
.qnc__q--nat .qnc__q__list:nth-of-type(5) { grid-area: 3 / 1 / 4 / 3; }
.qnc__q--nat .qnc__q__list:nth-of-type(6) { grid-area: 4 / 1 / 5 / 3; }

.qnc__q--pri .qnc__q__list:nth-of-type(1) { grid-area: 1 / 1 / 2 / 3; }
.qnc__q--pri .qnc__q__list:nth-of-type(2) { grid-area: 2 / 1 / 3 / 2; }
.qnc__q--pri .qnc__q__list:nth-of-type(3) { grid-area: 2 / 2 / 3 / 3; }
.qnc__q--pri .qnc__q__list:nth-of-type(4) { grid-area: 3 / 1 / 4 / 3; }
.qnc__q--pri .qnc__q__list:nth-of-type(5) { grid-area: 4 / 1 / 5 / 3; }

.qnc__notice { margin-top: 19px; font: 400 1.2rem var(--ff-nosa); line-height: 1.5; }

.qnc__c-wrap { position: relative; margin-top: 35px; font-family: var(--ff-nosa); }
.qnc__c-wrap::before,
.qnc__c__label::before { position: absolute; display: block; background: #000; content: ""; }
.qnc__c {  }
.qnc__c__label { position: relative; display: flex; justify-content: center; align-items: center; background: var(--c-green); border-radius: 6px; font-size: 1.8rem; line-height: 1.25; text-align: center; color: #fff; }
.qnc__c__list-wrap {  }
.qnc__c__list { font-size: 1.4rem; line-height: 1.5; }
.qnc__c__list::before { content: "\025b6"; }
.qnc__c__list:last-of-type::after { content: "など"; margin-left: 5px; }

@media screen and (max-width: 680px) {
	.qnc__ttl { flex-direction: column; text-align: center; }
	.qnc__ttl__sub { margin-top: 9px; }
	
	.qnc__q:not(:first-of-type) { margin-top: 23px; }
	.qnc__q__list._lslesser { letter-spacing: -0.15em; }
	
	.qnc__c-wrap { padding-left: 24px; }
	.qnc__c-wrap::before { top: 50%; transform: translateY(-50%); left: 0; width: 1px; height: calc(100% - 71px); }
	.qnc__c { display: grid; grid-template-columns: 92px 1fr; grid-template-rows: 1fr; grid-column-gap: 12px; grid-row-gap: 0px; }
	.qnc__c:not(:first-of-type) { margin-top: 25px; }
	.qnc__c__label { min-height: 72px; }
	.qnc__c__label::before { top: 50%; transform: translateY(-50%); right: 100%; width: 24px; height: 1px; }
	.qnc__c__list-wrap { align-content: center; }
	.qnc__c__list {  }
}
@media screen and (min-width: 681px) {
	
	.sec--qnc { padding-top: 84px; padding-bottom: 117px; }
	.qnc-wrap { margin-top: 134px; }
	.qnc {  }
	.qnc:not(:first-of-type) { margin-top: 88px; }
	.qnc__ttl { justify-content: center; align-items: center; margin-bottom: 20px; padding-bottom: 49px; }
	.qnc__ttl__main { font-size: 4.0rem; }
	.qnc__ttl__sub { margin-left: 4px; font-size: 2.0rem; }
	.qnc__ttl::before { width: 50px; }
	.qnc__catch { font-size: 1.8rem; line-height: 2; }
	.qnc__q-wrap { position: relative; display: grid; grid-template-columns: repeat(2, 1fr); grid-template-rows: 1fr; grid-column-gap: 80px; grid-row-gap: 0px; width: 800px; margin-top: 24px; margin-left: auto; margin-right: auto; }
	.qnc__q-wrap::before { position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 2px; height: calc(100% - 5px); background: url("../img/home/ptn_dot_vert.png") repeat-y 50% 0/100% auto; content: ""; pointer-events: none; }
	.qnc__q {  }
	.qnc__q__label { height: 50px; border-radius: 12px; font-size: 2.8rem; }
	.qnc__q__list-wrap { grid-row-gap: 8px; margin-top: 18px; }
	.qnc__q__list { font-size: 1.6rem; }
	.qnc__q__list._lslesser { letter-spacing: -0.15em; }
	.qnc__notice { width: 800px; margin-top: 24px; margin-left: auto; margin-right: auto; font-size: 1.4rem; line-height: 1.5; }
	
	.qnc__c-wrap { display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: 1fr; grid-column-gap: 40px; grid-row-gap: 0px; width: 800px; margin-top: 23px; margin-left: auto; margin-right: auto; padding-top: 32px; }
	
	.qnc__c-wrap::before { top: 0; left: 50%; transform: translateX(-50%); width: calc(100% - 240px); height: 1px; }
	.qnc__c {  }
	.qnc__c__label { height: 50px; border-radius: 12px; padding-bottom: 2px; font-size: 2.4rem; }
	.qnc__c__label::before { left: 50%; transform: translateX(-50%); bottom: 100%; width: 1px; height: 32px; }
	.qnc__c__list-wrap { margin-top: 13px; }
	.qnc__c__list { font-size: 1.6rem; font-weight: 400; line-height: 1.75; }
	
	.qnc__c__list::before { font-size: 80%; }
	.qnc__c__list:last-of-type::after { font-size: 80%; }
	
}


/* Topics
-------------------------------*/
.sec--topics { padding-top: 59px; padding-bottom: 96px; }
.topics-wrap { margin-top: 83px; }
.topics { position: relative; padding-bottom: 8px; }
.topics::before { position: absolute; top: 0; right: calc(100% + 20px); display: block; width: 8px; height: 100%; background: var(--c-dgreen); content: ""; }
.topics:not(:first-of-type) { margin-top: 56px; }
.topics--1 {  }
.topics--2 {  }
.topics__upper {  }
.topics__upper__ttl { font-size: 2.8rem; font-weight: 500; line-height: 1.5; text-align: left; }
.topics__upper__txt { margin-top: 14px; font-size: 1.6rem; line-height: 1.75; text-align: justify; }

.topics__article { display: grid; grid-template-columns: 159px 1fr; grid-template-rows: repeat(2, auto); grid-column-gap: 16px; grid-row-gap: 0px; }
/*	grid-template-columns: 49.9% 45.1%; grid-template-rows: repeat(2, auto); grid-column-gap: 5%; grid-row-gap: 0px;	*/
.topics__article:not(:first-of-type) { margin-top: 24px; }
.topics__article__img {  }
.topics__article__img img { width: 100%; height: 100%; object-fit: cover; }
.topics__article__txt { margin-top: -5px; font-size: 1.4rem; line-height: 1.5; text-align: justify; }
.topics__article__btn { display: flex; justify-content: center; align-items: center; height: 50px; background: #000; padding-bottom: 2px; font-size: 1.6rem; line-height: 1; color: #fff; }
.topics__article__btn span { font-size: 1.6rem; line-height: 1; color: #fff; }
.topics__article__btn::after { width: 18px; height: 18px; background: url("../common/img/icon_blank.png") no-repeat center/contain; margin-left: 20px; content: ""; opacity: .5; }
.topics--1 .topics__lower {  }

.topics--1 .topics__article { grid-row-gap: 16px; }

.topics--1 .topics__article__img {  }
.topics--1 .topics__article__txt {  }
.topics--1 .topics__article__btn {  }

.topics__article.dispblock { display: block; }
@media screen and (max-width: 680px) {
	.topics-wrap { padding-left: 4px; padding-right: 4px; }
	.topics__lower { margin-top: 35px; }
	.topics--1 .topics__article__img { grid-area: 1 / 1 / 2 / 2; }
	.topics--1 .topics__article__txt { grid-area: 1 / 2 / 2 / 3; }
	.topics--1 .topics__article__btn { grid-area: 2 / 1 / 3 / 3; } 
	.topics__article.dispblock { margin-right: -32px; }
}
@media screen and (min-width: 681px) {
	.sec--topics { padding-top: 84px; padding-bottom: 120px; }
	.topics-wrap { margin-top: 137px; }
	.topics { display: grid; grid-template-columns: 321px 1fr; grid-template-rows: 1fr; grid-column-gap: 48px; grid-row-gap: 0px; padding: 5px 0 11px 40px; }
	.topics::before { right: auto; left: 0; }
	.topics:not(:first-of-type) { margin-top: 80px; }
	.topics-ttl .cmnttl__jp { letter-spacing: 0.1em; text-indent: 0.1em; }
	.topics__upper__ttl { font-size: 3.2rem; line-height: 1.4; }
	.topics__upper__txt { margin-top: 26px; font-size: 1.8rem; letter-spacing: 0.02em; }
	.topics__upper__txt ._ktkn { letter-spacing: -0.15em; }
	.topics__lower { padding-top: 10px; }
	.topics__article { display: grid; grid-template-columns: 159px 1fr; grid-template-rows: repeat(2, auto); grid-column-gap: 16px; grid-row-gap: 0px; }
	.topics__article__img {  }
	.topics__article__txt { font-size: 1.6rem; line-height: 1.75; }
	.topics__article__btn { justify-content: space-between; height: 60px; padding: 0 20px 0 0; }
	.topics__article__btn span { transition: .4s; flex: 1; text-align: center; }
	.topics__article__btn:hover span { color: var(--c-mustard); }
	.topics__article__btn::after { margin-left: 0; }
	.topics--1 .topics__article:last-of-type .topics__article__btn span { letter-spacing: -0.1em; }
	.topics--1 .topics__article:not(:first-of-type) { margin-top: 40px; padding-top: 40px; border-top: 1px solid #dcdcdc; }
	.topics--1 .topics__article { grid-template-columns: 273px 1fr; grid-template-rows: repeat(2, auto); grid-column-gap: 32px; grid-row-gap: 9px; }
	.topics--1 .topics__article__img { grid-area: 1 / 1 / 3 / 2; }
	.topics--1 .topics__article__txt { grid-area: 1 / 2 / 2 / 3; }
	.topics--1 .topics__article__btn { grid-area: 2 / 2 / 3 / 3; align-self: flex-end; }
	
	.topics--2 .topics__lower { position: relative; display: grid; grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(2, auto); grid-column-gap: 60px; grid-row-gap: 0; }
	.topics--2 .topics__lower::before { position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); display: block; width: 1px; height: 100%; background: #dcdcdc; content: ""; z-index: 0; }
	.topics--2 .topics__lower .topics__article:nth-of-type(1) { position: relative; grid-area: 1 / 1 / 2 / 3; background: #fff; padding-bottom: 30px; z-index: 10; }
	.topics--2 .topics__lower .topics__article:nth-of-type(2) { grid-area: 2 / 1 / 3 / 2; }
	.topics--2 .topics__lower .topics__article:nth-of-type(3) { grid-area: 2 / 2 / 3 / 3; }
	.topics--2 .topics__article { display: block; margin-top: 0; }
	.topics__article__txt--lslesser { letter-spacing: -0.1em; }
	.topics--2 .topics__article__txt { margin-top: 18px; }
	.topics--2 .topics__article__txt ._ktkn { letter-spacing: -0.1em; }
	.topics__video { transition: .4s; }
	.topics__video:hover { filter: brightness(110%); }
}


/* Tuition
-------------------------------*/
.sec--tuition { background: #f5f5f5; padding-top: 61px; padding-bottom: 88px; }
.tuition-ttl .cmnttl__en { color: #004da0; }
.tuition-ttl .cmnttl__jp { color: #000; }
.tuition-ttl .cmnttl__deco::before { background: #000; }

.tuition-chart-wrap { margin-top: 84px; }
.tuition-chart img { max-width: none; width: 577px; }
.tuition-chart-notice { margin-top: 12px; font: 400 1.2rem var(--ff-nosa); line-height: 1.5; }
@media screen and (max-width: 627px) {
	.tuition-chart { margin-left: -24px; margin-right: -24px; }
}
@media screen and (min-width: 628px) {
	.tuition-chart img { width: 100%; }
}
@media screen and (min-width: 681px) {
	.sec--tuition { padding-top: 84px; padding-bottom: 117px;}
	.tuition-chart-wrap { margin-top: 137px; }
	.tuition-chart-notice { font-size: 1.4rem; }
}


/* 
-------------------------------*/

@media screen and (max-width: 680px) {
	
}
@media screen and (min-width: 681px) {
	
}


/* 
-------------------------------*/

@media screen and (max-width: 680px) {
	
}
@media screen and (min-width: 681px) {
	
}


/* 
-------------------------------*/

@media screen and (max-width: 680px) {
	
}
@media screen and (min-width: 681px) {
	
}


/* 
-------------------------------*/

@media screen and (max-width: 680px) {
	
}
@media screen and (min-width: 681px) {
	
}


/* 
-------------------------------*/

@media screen and (max-width: 680px) {
	
}
@media screen and (min-width: 681px) {
	
}


/*----------------------------
	Popup
----------------------------*/
.popup-content { position: relative; border: 1px solid var(--c-wine); width: 100%; max-width: 1000px; margin: 0 auto; }
.mfp-container { padding: 0; }
.slider-wrapper {  }
button.mfp-close { top: -14px; right: 14px; width: 40px; height: 40px; background: url("../img/home/icon_modal_close.png") no-repeat center/20px auto; opacity: 1; }
.mfp-close:active { top: -14px; }

/* 非表示button設定 */
.mfp-hide { display: none; }

.mfp-bg { background: rgba(0,118,95,0.8); }
.cmn-modal { padding: 24px; }
.cmn-modal__inner { max-height: calc(100vh - 220px); overflow: auto; background: #fff; }


/*		Concept Modal		*/
.concept-modal__inner { background: var(--c-mustard); padding: 12px 2px; }
.concept-modal__board { position: relative; background: #fff; padding: 27px 0 40px; }
.concept-modal__board::before,
.concept-modal__board::after { position: absolute; left: 0; display: block; width: 100%; height: 1px; background: var(--c-mustard); content: ""; }
.concept-modal__board::before { top: 4px; }
.concept-modal__board::after { bottom: 4px; }
.concept-modal__ttl { position: relative; margin-bottom: 40px; font: 400 2.0rem var(--ff-grmd); line-height: 1; letter-spacing: 0.08em; text-indent: 0.08em; text-align: center; color: var(--c-mustard); }
.concept-modal__ttl::before { position: absolute; left: 50%; transform: translateX(-50%); top: calc(100% + 10px); display: block; width: 1px; height: 16px; background: var(--c-mustard); content: ""; }
.concept-modal__txt-wrap {  }
.concept-modal__txt { font-size: 1.4rem; line-height: 1.75; text-align: center; }
.concept-modal__txt:not(:first-of-type) { margin-top: 24px; }
@media screen and (min-width: 681px) {
	.concept-modal { padding: 0 145px; }
	.concept-modal+button.mfp-close { top: -40px; right: 135px; }
	.concept-modal__inner { padding: 16px 2px; }
	.concept-modal__board { padding: 64px 0 71px; }
	.concept-modal__board::before { top: 8px; }
	.concept-modal__board::after { bottom: 8px; }
	.concept-modal__ttl { margin-bottom: 45px; font-size: 3.2rem; }
	.concept-modal__ttl::before { top: calc(100% + 17px); }
	.concept-modal__txt-wrap {  }
	.concept-modal__txt { font-size: 1.8rem; line-height: 2; }
	.concept-modal__txt:not(:first-of-type) { margin-top: 36px; }
}


/*		Vision Modal		*/
#popup-vision { transform: translateY(17px); }
#popup-vision .slide-item { width: 303px; }
.vision-modal { padding: 0; }
.vision-modal__inner { max-height: calc(100vh - 250px); padding: 10px; }
.vision-modal__board { position: relative; background: #fff; border: 2px solid var(--c-dgreen); padding: 35px 20px 60px; }
.vision-modal__board::before,
.vision-modal__board::after { position: absolute; display: block; content: ""; pointer-events: none; }
.vision-modal__board::before { top: 50%; left: 50%; transform: translate(-50%, -50%); width: calc(100% - 6px); height: calc(100% - 6px); border: 1px solid var(--c-dgreen); }
.vision-modal__board::after { left: 0; bottom: 0; width: 0; height: 0; border-style: solid; border-width: 0px 24px 24px 0px; border-color: transparent transparent var(--c-dgreen) transparent; }


.vision-modal__label { position: absolute; top: 59px; right: -46px; transform: rotate(90deg); transform-origin: center; display: block; background: #fff; padding: 0 9px; font: 500 1.6rem var(--ff-grmd); line-height: 1; text-align: center; color: var(--c-dgreen); }
.vision-modal__ttl { font-size: 2.4rem; line-height: 1.4167; letter-spacing: -0.02em; }
.vision-modal__ttl ._emp { position: relative; display: inline-block; }
.vision-modal__ttl ._emp::before { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -46%); display: block; width: calc(100% + 4px); height: calc(100% - 4px); background: #fff000; content: ""; mix-blend-mode: multiply; }
.vision-modal__txt { margin-top: 78px; font-size: 1.4rem; line-height: 1.75; text-align: justify; }

#popup-vision button.mfp-close { top: -43px; right: 26px; }
#popup-vision .mfp-close:active { top: -43px; }

.vision-modal__ttl-wrap { position: relative; margin-left: 50px; margin-right: 50px; }
.vision-modal__ttl-wrap img { width: auto; height: 224px; }
@media screen and (max-width: 375px) {
	
}
@media screen and (max-width: 680px) {
	.vision-modal__ttl { white-space: nowrap; }
	.vision-modal__inner {  }
}
@media screen and (min-width: 681px) {
	#popup-vision { transform: translateY(32px); }
	#popup-vision .slide-item { width: 1000px; }
	.vision-modal { padding: 0; }
	.vision-modal__inner { max-height: calc(100vh - 200px); padding: 16px; }
	.vision-modal__board { padding: 68px 82px 110px; }
	.vision-modal__board::after { border-width: 0px 32px 32px 0px; }
	.vision-modal__label { top: 77px; right: -66px; transform: rotate(90deg); padding: 0 19px; font-size: 2.0rem; }
	.vision-modal__ttl { font-size: 4.0rem; line-height: 1.5; letter-spacing: 0.06em; text-indent: 0.06em; text-align: center; }
.vision-modal__ttl ._emp::before { transform: translate(-50%, -46%); width: calc(100% + 4px); }
	.vision-modal__txt { margin-top: 70px; font-size: 1.8rem; line-height: 2; }

#popup-vision button.mfp-close { top: -68px; right: -10px; }
#popup-vision .mfp-close:active { top: -68px; }

.vision-modal__ttl-wrap { position: relative; margin-left: 50px; margin-right: 50px; }
.vision-modal__ttl-wrap img { width: auto; height: 224px; }
	
}


/*		Modal for YouTube		*/
.mfp-iframe-scaler button.mfp-close { top: -39px; right: 0; width: 40px; height: 40px; background: url("../img/home/icon_modal_close.png") no-repeat center/20px auto; }



/*	Arrow, Dot Customize	*/
.my-slider .slick-list { overflow: inherit !important; padding-top: 35px !important;  }
.my-slider .slick-slide { transition: transform 0.4s ease; }
.my-slider .slick-current { transform: translateY(-35px); }
.slide-item { margin: 0 4px; }

.slick-prev,
.slick-next { z-index: 10; top: 190px; width: 40px; height: 40px; background: var(--c-mustard); border-radius: 50%; opacity: 1; }
.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus { background: var(--c-mustard); opacity: 1; }
.slick-prev { left: 20px; }
.slick-next { right: 20px; }

.slick-prev::before,
.slick-next::before { position: absolute; top: 50%; left: 50%; transform-origin: center; width: 8px; height: 8px; border-right: 2px solid #fff; border-top: 2px solid #fff; content: ""; }
.slick-prev::before { transform: translate(-30%, -50%) rotate(225deg); }
.slick-next::before { transform: translate(-70%, -50%) rotate(45deg); }

.slick-dots { bottom: auto; top: 180px; display: flex; justify-content: center; align-items: center; }
.slick-dots li { width: 6px; height: 6px; padding: 8px; box-sizing: content-box; margin: 0; }
.slick-dots li button { width: 6px; height: 6px; padding: 0; border-radius: none; background: var(--c-dgreen); font-size: 0; line-height: 0; }
.slick-dots li button::before { display: none; }
.slick-dots li.slick-active button { background: var(--c-mustard); }

@media screen and (min-width: 681px) {
	.my-slider .slick-current { transform: translateY(-64px); }
	.slide-item { margin: 0 16px; }
	.slick-prev, .slick-next { top: 246px; width: 70px; height: 70px; }
	.slick-prev { left: auto; right: calc(100% + 14px); }
	.slick-next { right: auto; left: calc(100% + 14px); }
	.slick-dots { top: 200px; }
	.slick-dots li { width: 8px; height: 8px; padding: 8px; }
	.slick-dots li button { width: 8px; height: 8px; }
	

	
	
}








/*
button.mfp-close::before { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; width: 33px; height: 20px; background: url("../img/home/icon_modal_close.png") no-repeat center/contain; content: ""; }
*/












#popup-method .slide-item--4 .field-modal__ttl-wrap { margin-left: 40px; margin-right: 40px; }
#popup-method .slide-item--7 .field-modal__ttl-wrap { margin-left: 30px; margin-right: 30px; }



#popup-method .field-modal__ttl-wrap { margin-top: 67px; }


.slide-item--1 .field-modal,
.slide-item--3 .field-modal { background: var(--c-violet); }
.slide-item--2 .field-modal,
.slide-item--4 .field-modal { background: var(--c-yellow); }
.slide-item--5 .field-modal { background: var(--c-orange); }
.slide-item--6 .field-modal,
.slide-item--7 .field-modal { background: var(--c-mint); }

.field-modal__ttl--method { position: relative; text-align: center; }
.field-modal__ttl--method__txt { position: relative; z-index: 10; }
.field-modal__ttl--method__txt::before { position: absolute; left: 50%; transform: translateX(-50%); bottom: -8px; display: block; width: calc(100% + 40px); height: 26px; background: var(--c-yellow); content: ""; z-index: -1; }
.method-modal__subttl { border-top: 2px solid var(--c-wine); padding-top: 51px; font-size: 2.8rem; font-weight: 700; line-height: 1.5714; letter-spacing: 0.025em; text-indent: 0.025em; text-align: center; }
.field-modal__txt--method { width: 100%; }
.method-modal__exp-wrap { display: flex; justify-content: space-between; margin-top: 23px; }
.method-modal__exp { width: calc(50% - 20px); }

@media screen and (min-width: 681px) {
	
}
@media screen and (max-width: 680px) {
	
	
/*button.mfp-close::before { width: 15px; height: 9px; }*/
	

	.field-modal { padding: 10px; border-radius: 10px; }
	.field-modal__inner { max-height: calc(100vh - 200px); border-radius: 7px; padding: 0 20px 20px; }
	.field-modal__label { width: 240px; height: 35px; border-radius: 0 0 7px 7px; font-size: 1.2rem; }
	
	#popup-field .field-modal__ttl-wrap { margin: 0; }
	#popup-field .field-modal__ttl-wrap img { height: 85px; }
	#popup-field .slide-item--1 .field-modal__ttl-wrap img { margin: 12px auto 9px; }
	#popup-field .slide-item--2 .field-modal__ttl-wrap img { margin: 13px auto 8px; }
	#popup-field .slide-item--3 .field-modal__ttl-wrap img { margin: 4px auto 5px; }
	#popup-field .slide-item--4 .field-modal__ttl-wrap img { margin: 12px auto 8px; }
	#popup-field .slide-item--5 .field-modal__ttl-wrap img { margin: 12px auto 9px; }
	#popup-field .slide-item--6 .field-modal__ttl-wrap img { margin: 11px auto 8px; }
	#popup-field .slide-item--7 .field-modal__ttl-wrap img { margin: 16px auto 3px; }
	
	#popup-method .field-modal__ttl-wrap { margin-top: 35px; margin-left: 0; margin-right: 0; }
	
	.field-modal__ttl { font-size: 1.8rem; line-height: 1.5; letter-spacing: 0; text-indent: 0; text-align: center; }
	.field-modal__txt { width: auto; margin: 18px auto 0; font-size: 1.2rem; line-height: 2.08334; }
	.field-modal__learn { flex-direction: column; margin: 54px 0 0; }
	.field-modal__learn__ttl { width: 170px; height: 30px; border-radius: 15px; margin-right: 0; font-size: 1.2rem; }
	.field-modal__learn__txt { margin-top: 13px; font-size: 1.6rem; line-height: 1.4375; text-align: center; }
	.field-modal__exp { position: relative; height: 195px; border: 1px solid var(--c-wine); padding-top: 0; overflow: hidden; }
	.field-modal__exp a { display: block; }
	.field-modal__exp::before,
	.field-modal__exp::after { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; content: ""; pointer-events: none; }
	.field-modal__exp::before { width: 100%; height: 100%; background: rgba(255,255,255,.7); z-index: 10; }
	.field-modal__exp::after { width: 30px; height: 30px; background: url("../img/home/icon_expand.png") no-repeat center/contain; z-index: 50; }
	.field-modal__exp img { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: none; width: calc(100% + 100px); }
	.field-modal__exp--pc { display: none; }
	
	.field-modal__btn-wrap { margin-top: 20px; }
	.field-modal__btn { min-width: 197px; height: 66px; border-width: 1px; border-radius: 8px; padding: 0 20px 2px 14px; font-size: 1.5rem; }
	.field-modal__btn span { flex: 1; text-align: center; }
	.field-modal__btn::after { margin-left: 0; }
	.slide-item--7 .field-modal__btn::after { margin-left: 14px; }
	.field-modal__ttl--method--pc { display: none; }

	.field-modal__ttl--method__txt::before { bottom: 0; width: calc(100% + 10px); height: 15px; }
	.method-modal__subttl { border-bottom: 2px solid var(--c-wine); padding: 15px 0 16px; font-size: 1.5rem; line-height: 1.5334; letter-spacing: 0; text-indent: 0; }
	.field-modal__txt--method { width: 100%; }
	.method-modal__exp-wrap { flex-direction: column; justify-content: flex-start; }
	.method-modal__exp { width: 100%; }
	.method-modal__exp:not(:first-of-type) { margin-top: 20px; }

}
@media screen and (max-width: 390px) {
	.method-modal__subttl { margin-left: -10px; margin-right: -10px; }
}



@keyframes concept-scroll {
	0% { top: 0; }
	100% { top: 100%; }
}
