@charset "utf-8";

/*----------------------------------------------------------------------------------------------------------------------------

reset & root set

----------------------------------------------------------------------------------------------------------------------------*/

/* reset
--------------------------------------------------------------*/

*,*::before,*::after { box-sizing: border-box; }
ul,ol { margin: 0; padding: 0; list-style: none; }
body,h1,h2,h3,h4,h5,p,figure,blockquote,dl,dd { margin: 0; font-size: inherit; }
img,video { max-width: 100%; height: auto; display: block; }
header,footer,main,aside,picture { display: block; }

/* form parts reset */
textarea { font: inherit; appearance: none; }
select { border: none; outline: none; font-weight: inherit; }
button,input[type="submit"],input[type="button"] { border-radius: 0; appearance: button; border: none; outline: none; cursor: pointer; }
input[type="submit"]:focus,input[type="button"]:focus { outline-offset: -2px;}
input[type="submit"]::-webkit-search-decoration,input[type="button"]::-webkit-search-decoration { display: none;}

/* iOS Safari tap reset */
body {-webkit-tap-highlight-color: transparent;}



/* print set
--------------------------------------------------------------*/
@media print{
html { width: 1280px; }
.header { position: relative !important; }/* fixheader clear */
[class*="iv-"] { opacity: 1; }/* inview view */
}


/* root set
--------------------------------------------------------------*/

/* color */
:root {
    --cl-key: #CCAC5C;
    --cl-txt: #FFF;
    --cl-txtbk: #333;
    --cl-txtgr: #aaa;
    --cl-border: #707070;
    --cl-border2: #69582E;
    --cl-bg: #111;
    --cl-wh: #fff;
    --cl-bk: #000;
}

/* font set */
:root {
    /* font: style weight size / line-height family */
    --ff-sans: normal 500 1.4rem / 1.6 'Noto Sans JP', sans-serif;
    --ff-serif: normal 700 1.4rem / 1.6 'Noto Serif JP', serif;
}




/*----------------------------------------------------------------------------------------------------------------------------

base set

----------------------------------------------------------------------------------------------------------------------------*/
html { font-size:calc(100vw / 37.5); scroll-behavior: smooth; }
body { min-height: 100vh;color: var(--cl-txt); background-color: var(--cl-bk); font: var(--ff-sans); }
a { color: var(--cl-txt); outline:none; text-decoration:none; }

@media print, screen and (min-width: 640px) {
html { font-size: calc(100vw / 128); }
body { font-size: 1.8rem; }
}

@media print, screen and (min-width: 1280px) {
html { font-size:62.5%; }
body { font-size: 1.8rem; }
a { transition: 0.5s; }
a:hover { opacity: 0.7; }
button:hover { opacity: 0.7; }
}









/*----------------------------------------------------------------------------------------------------------------------------

utility & inview set

----------------------------------------------------------------------------------------------------------------------------*/

/* utility - base
---------------------------------------------------- */

/* utility - base responsive */
.u-inner { max-width: 112rem; margin: 0 auto; width: 90%; position: relative; }
.u-only-pc	{ display: none; }
@media print, screen and (min-width: 640px) {
.u-inner { width: 100%; }
.u-only-sp	{ display: none !important; }
.u-only-pc	{ display: inherit; }
}
@media print, screen and (min-width: 1280px) {
}






/* utility - project */
.u-title-section { font: var(--ff-serif); text-align: center; white-space: nowrap; font-size: 2.4rem; margin-bottom: 1.5em; }
.u-title-block { font: var(--ff-serif); font-size: 1.8rem; }
.u-box { background-color: var(--cl-bg); border: var(--cl-border) 1px solid; padding: 1.5rem; }
.u-sectbg { padding: 8rem 0; background: url(/assets/images/home/bg_section.webp) no-repeat center top / 120rem; }


@media print, screen and (min-width: 640px) {
.u-title-section { font-size: 4.2rem; }
.u-title-block { font-size: 3rem; }
.u-box { padding: 4rem; }
.u-sectbg { padding: 12rem; background-size: 160rem; }

}










/* iv-animation
---------------------------------------------------- */
.iv-fade { opacity:0; transition: 0.8s; }
.iv-fade._view { opacity:1; }
.iv-up_fade { opacity:0; transform:translate(0, 6rem); transition: 0.8s; }
.iv-up_fade._view { opacity:1; transform:translate(0, 0); }








/*----------------------------------------------------------------------------------------------------------------------------

base layout

----------------------------------------------------------------------------------------------------------------------------*/


/* main contents
--------------------------------------------------------------*/
.main { min-height: 50vh; }
.footer {}
.fcopy { font-size: 1.2rem; text-align: center; color: var(--cl-txtgr); padding: 2rem 0; background-color: var(--cl-bg); }
@media print, screen and (min-width: 640px) {
.fcopy { font-size: 1.4rem; padding: 4rem 0; }
}




/* cta */
.cta { background: url(/assets/images/home/bg_cta_sp.webp) no-repeat right center / cover; padding: 4rem 0; }
.cta .u-title-section { text-align: left; }
.cta-row {}
.cta-txtbox {}
.cta-btnbox { background-color: rgba(0,0,0,0.6); border: var(--cl-border2) 1px solid; text-align: center; margin-top: 3rem; padding-top: 3rem; }
.cta-btnbox .u-title-block { font-size: 2.4rem; border-bottom: var(--cl-border2) 1px solid; padding-bottom: 2rem; }
.cta .c-price { margin-top: 5rem; }

@media print, screen and (min-width: 640px) {
.cta { background: url(/assets/images/home/bg_cta_pc.webp) no-repeat center center / cover; padding: 8rem 0; }
.cta-row { display: grid; grid-template-columns: 1fr 44rem; }
.cta-txtbox { line-height: 2; }
.cta-btnbox { padding: 4rem 2rem 0; margin-top: 10rem; }
.cta-btnbox .u-title-block { font-size: 3rem; }
.cta-btnbox-btn { margin: 0 -2rem; transition: 0.3s; }
.cta-btnbox-btn:hover { scale: 1.05; }
.cta-btnbox-btn:hover a { opacity: 0.9; }
}


/* c-price */
.c-price { margin: 3rem 0; text-align: center; }
.c-price._regular { color: var(--cl-txtgr); text-decoration: line-through; }
.c-price-title { font-size: 1.6rem; }
.c-price-title span { font-size: 0.7em; }
.c-price-price { font-size: 2.4rem; }
.c-price-price span { font-size: 0.7em; }

@media print, screen and (min-width: 640px) {
.c-price { margin-top: 3rem; }
.c-price._regular { padding-top: 3rem; }
.c-price-title { font-size: 2rem; }
.c-price-price { font-size: 4rem; line-height: 1.3; }
.c-price._regular .c-price-price { font-size: 3rem; }

}



/* c-book */
.c-book { display: grid; grid-template-columns: 8rem 1fr; gap: 1rem; }
.c-book-image { grid-area: 1/1/2/2; }
.c-book-title { grid-area: 1/2/2/3; margin-top: 1.5rem; white-space: nowrap; }
.c-book-title strong { font-size: 1.25em; }
.c-book-txt { grid-area: 2/1/3/3; }

@media print, screen and (min-width: 640px) {
.c-book { display: grid; grid-template-columns: 16rem 1fr; gap: 2rem 6rem; }
.c-book-image { grid-area: 1/1/3/2; padding-left: 2rem; }
.c-book-title { grid-area: 1/2/2/2; margin-top: 1.5rem; font-size: 2.4rem; }
.c-book-txt { grid-area: 2/2/3/3; padding-right: 2rem; font-size: 1.6rem; }
}




/*----------------------------------------------------------------------------------------------------------------------------

page contents

----------------------------------------------------------------------------------------------------------------------------*/

/* kv */
.kv { background: url(/assets/images/home/bg_kv.webp) no-repeat center top / 80rem; }
.kv-ak { width: 10rem; margin: 3rem -1rem 0 auto; }
.kv-maintitle { font: var(--ff-serif); margin-top: -10rem; }
.kv-maintitle span { display: block; }
.kv-maintitle-1 { font-size: 1.4rem; background-color: var(--cl-wh); color: var(--cl-bk); width: fit-content; padding: 0 0.5em; rotate: -10deg; margin-left: -1.5em; }
.kv-maintitle-2 { font-size: 1.575rem; }
.kv-maintitle-3 { font-size: 1.3rem; letter-spacing: 0.13em; }
.kv-title { font: var(--ff-serif); line-height: 1.3; white-space: nowrap; font-size: 3.2rem; margin-top: 1rem; }
.kv-title span { color: var(--cl-key); }
.kv-title strong { font-size: 1.35em; }
.kv-lead { margin-top: 1em; line-height: 2; font-size: 1.2rem; }
.kv-row { margin-top: 2rem; }
.kv-point {}
.kv-btn {}

@media print, screen and (min-width: 640px) {
.kv { background-size: 160rem; padding-top: 11rem; }
.kv-ak { width: 31rem; position: absolute; top: 16rem; right: 0; }
.kv-maintitle { margin-top: -4rem; }
.kv-maintitle-1 { font-size: 1.8rem; }
.kv-maintitle-2 { font-size: 2.4rem; }
.kv-maintitle-3 { font-size: 1.6rem; letter-spacing: 0.38em; }
.kv-title { font-size: 7.2rem; margin-top: 2rem; }
.kv-lead { font-size: 2rem; }
.kv-row { margin-top: 2rem; display: grid; grid-template-columns: 44rem 1fr; align-items: center; }
.kv-point { order: 2; }
.kv-btn { order: 1; transition: 0.3s; }
.kv-btn:hover { scale: 1.05; }
.kv-btn:hover a { opacity: 0.9; }
.kv-book { margin-top: 3rem; }
}




/* check */
.check {}
.check-lead { text-align: center; line-height: 3; }
.check-txttitle { border-top: var(--cl-border) 1px solid; padding: 2em 0; margin-top: 4em; }
.check-txt { border-top: var(--cl-border) 1px solid; padding: 2em 0; line-height: 1.8; font-size: 1.3rem; }
.check-txt strong { background-color: var(--cl-border2); }
.check-row { display: grid; gap: 3rem; }
.check-box {}
.check-list { border-top: var(--cl-border) 1px solid; margin-top: 1.5rem; }
.check-list-item { white-space: nowrap; background: url(/assets/images/home/ico_check.webp) no-repeat left top 0.2rem / 1.8rem; padding-left: 1.8rem; margin-top: 1.5rem; }

@media print, screen and (min-width: 640px) {
.check-lead { font-size: 2.0rem; }
.check-txttitle { width: 86rem; margin: 4em auto 0; }
.check-txt { font-size: 1.6rem; width: 86rem; margin: 0 auto 4em; }
.check-row { gap: 4rem; grid-template-columns: repeat(2,1fr); }
.check-list-item { background-size: 2.8rem; padding-left: 3.6rem; margin-top: 2rem; }
}








/* selfintro */
.selfintro {}
.selfintro-row {}
.selfintro-resume {}
.selfintro-resume-pic { width: 12rem; margin: auto; }
.selfintro-resume-name { font-size: 1.8rem;}
.selfintro-resume-detail { font-size: 1.2rem;}
.selfintro-resume-detail._second { margin-top: 1em; }
.selfintro-message { margin-top: 4rem; border-top: var(--cl-border) 1px solid; padding-top: 4rem; }
.selfintro-message strong { background-color: var(--cl-border2); }
.selfintro-message-list { margin-top: 2rem; }
.selfintro-message-list-item { margin: 0.25em 0 0.25em 1em; list-style-type: disc; }
.selfintro-graph { margin: 4rem auto 0; }

@media print, screen and (min-width: 640px) {
.selfintro-row { display: grid; grid-template-columns: 32rem 1fr; gap: 12rem; }
.selfintro-resume-pic { width: 100%; }
.selfintro-resume-name { font-size: 2.4rem; margin-top: 1rem; }
.selfintro-resume-detail { font-size: 1.3rem; margin-top: 0.5rem; line-height: 1.8; }
.selfintro-message { line-height: 2; border: none; padding: 0; }
.selfintro-message-list { margin-top: 5rem; }
}

/* selfintro - rs */
.rstitle { text-align: center; font: var(--ff-serif); margin: 3rem 0 1rem; }
.rs { background-color: var(--cl-bg); border: var(--cl-border) 1px solid; font-size: 1.2rem; }
.rs-item { display: grid; align-items: center; grid-template-columns: 4rem 6rem 6rem 1fr; border-bottom: var(--cl-border) 1px solid; }
.rs-item-num { grid-area: 1/1/3/2; text-align: center; }
.rs-item-area { grid-area: 1/2/2/3; }
.rs-item-yield { grid-area: 2/2/3/3; border-top: var(--cl-border) 1px solid; }
.rs-item-age { grid-area: 1/3/2/4; }
.rs-item-structure { grid-area: 1/4/2/5; }
.rs-item-floor { grid-area: 2/3/3/5; border-top: var(--cl-border) 1px solid;  }
.rs-ex { font-size: 1.2rem; margin: 1em auto 0; max-width: 80rem; }

@media print, screen and (min-width: 640px) {
.rstitle { font-size: 2.4rem; margin: 4rem 0 2rem; }
.rs { font-size: 1.6rem; width: 80rem; margin: 0 auto; }
.rs-item { grid-template-columns: 6rem 8rem 8rem 10rem 1fr 1fr; }
.rs-item-num,
.rs-item-area,
.rs-item-yield,
.rs-item-age,
.rs-item-structure,
.rs-item-floor { grid-area: inherit; border: none; }

}



/* voice */
.voice {}
.voice-box { position: relative; margin-top: 3rem; }
.voice-box-pic { position: absolute; top: 1.5rem; width: 10rem; }
.voice-box-name { font: var(--ff-serif); font-size: 2rem; margin: 2rem 0 0 12rem; }
.voice-box-job { margin-left: 12rem; }
.voice-box-txt { margin-top: 4rem; }

@media print, screen and (min-width: 640px) {
.voice-box { margin-top: 4rem; }
.voice-box-pic { position: relative; top: 0; width: 12.5rem; }
.voice-box-name { font-size: 2.4rem; margin: 1rem 0 0; }
.voice-box-job { margin: 0; font-size: 1.4rem; }
.voice-box-txt { margin: -18rem 0 0 18rem; font-size: 1.6rem; line-height: 2; }
}






/* bookintro */
.bookintro {}
.bookintro-book { padding: 0 1.5rem; }
.bookintro-imagebox { margin-top: 3rem; }
.bookintro-image { padding: 1rem 0;}

@media print, screen and (min-width: 640px) {

.bookintro-book { padding: 0 10rem; }
.bookintro-book .c-book-image { padding: 0; }
.bookintro-txt .c-book-image { padding: 0; }

.bookintro-imagebox { padding: 10rem; display: grid; gap: 6rem; }
.bookintro-image { padding: 0;}

}




/* plan */
.plan {}
.plan-lead {}
.plan-box { margin-top: 3rem;}
.plan-box-txt { border-top: var(--cl-border) 1px solid; margin-top: 1.5rem; padding-top: 1.5rem; }
.plan-box-price {}
.plan-box-txtex { font-size: 1.2rem; padding-left: 1em; text-indent: -1em; }
.plan-box-notice { margin-top: 1.5rem; }
.plan-box-noticetxt { font-size: 1.2rem; padding-left: 1em; text-indent: -1em; }

@media print, screen and (min-width: 640px) {
.plan-lead { text-align: center; margin-bottom: 4rem; }
.plan-box { margin-top: 6rem;}
.plan-box-txt { font-size: 1.6rem; }
.plan-box-price { display: grid; grid-template-columns: repeat(3,1fr); align-items: center; margin-top: 4rem; }
.plan-box-price .c-price { margin: 0; text-align: left; }
.plan-box-price .c-price._regular { padding: 0; }
.plan-box-price-btn { transition: 0.3s; }
.plan-box-price-btn:hover { scale: 1.05; opacity: 0.9; }
.plan-box-price-btn {}
.plan-box-txtex { font-size: 1.4rem; }
.plan-box-price + .plan-box-txtex { margin-top: 3rem; }
.plan-box-notice { margin-top: 2rem; }
.plan-box-noticetxt { font-size: 1.4rem; }
}






/* faq */
.faq {}
.faq-list { margin-top: 3rem; }
.faq-list-q { display: grid; grid-template-columns: 4rem 1fr; font-size: 1.6rem; }
.faq-list-q::before { content: "Q"; font-size: 1.4rem; display: grid; place-content: center; width: 3rem; height: 3rem; background-color: var(--cl-border); border-radius: 100%; }
.faq-list-a { display: grid; grid-template-columns: 4rem 1fr; margin-top: 1.5rem; }
.faq-list-a::before { content: "A"; font-size: 1.4rem; display: grid; place-content: center; width: 3rem; height: 3rem; border: var(--cl-border) 1px solid; border-radius: 100%; }

@media print, screen and (min-width: 640px) {
.faq-list-q { grid-template-columns: 8rem 1fr; font-size: 2.2rem; }
.faq-list-q::before { content: "Q"; font-size: 2.4rem; width: 5rem; height: 5rem; padding-bottom: 0.2em; margin-top: -0.25em; }
.faq-list-a { display: grid; grid-template-columns: 8rem 1fr; margin-top: 2.5rem; }
.faq-list-a::before { content: "A"; font-size: 2.4rem; width: 5rem; height: 5rem; padding-bottom: 0.2em; margin-top: -0.25em; }
}




/* terms */
.terms { padding-bottom: 6rem; }
.terms-title {}
.terms-itemtitle { margin-top: 1rem; }
.terms-itemtxt { font-size: 1.2rem; margin-left: 1.25em; }
.terms-itemlist { font-size: 1.2rem; margin-left: 2.25em; }
.terms-itemlist-txt { list-style-type: decimal; }
.terms-itemex { font-size: 1.2rem; margin-top: 1rem; }

@media print, screen and (min-width: 640px) {
.terms { padding-bottom: 10rem; }
.terms-itemtitle { font-size: 1.6rem; }
.terms-itemtxt { font-size: 1.4rem; }
.terms-itemlist { font-size: 1.4rem; }
.terms-itemex { font-size: 1.4rem; }
}


