@charset "UTF-8";
* { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, section, summary, time, mark, audio, video { margin: 0; padding: 0; font: inherit; word-wrap: break-word; border: 0; vertical-align: baseline; outline: none; }
body { padding: 0; margin: 0; color: #111; font-size: 3.4vw; font-family: 游ゴシック体, YuGothic, 'Yu Gothic', "游ゴシック Medium", "Yu Gothic Medium", 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;font-size: 3.5vw;line-height:1.8; font-weight: 400; font-style: normal; -webkit-text-size-adjust: 100%; }
_:-ms-lang(x)::-ms-backdrop, body { font-family: "メイリオ", Meiryo, sans-serif; }
article, aside, canvas, details, figcaption, figure, header, footer, hgroup, main, menu, nav, section, summary { display: block; }
blockquote, q { quotes: none; }
strong, b { font-weight: bold; }
ul, ol, li { list-style: none; }
table { border-spacing: 0; border-collapse: collapse; }
img, video, object { height: auto; border: none; display: block; }
ins { background: none; color: #000; text-decoration: none; }
mark { background-color: #ff9; color: #000; font-style: italic; font-weight: bold; }
del { text-decoration: line-through; }
abbr[title], dfn[title] { border-bottom: 1px dotted; cursor: help; }
hr { height: 1px; padding: 0; margin: 1em 0; border: 0; border-top: 1px solid #ccc; display: block; }
*:before, *:after { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; -moz-transition: all 0.4s cubic-bezier(0.05, 0.05, 0.31, 0.97); -o-transition: all 0.4s cubic-bezier(0.05, 0.05, 0.31, 0.97); -webkit-transition: all 0.4s cubic-bezier(0.05, 0.05, 0.31, 0.97); transition: all 0.4s cubic-bezier(0.05, 0.05, 0.31, 0.97); }
a {color: #111;text-decoration: none;display: block;-moz-transition: all 0.4s cubic-bezier(0.05, 0.05, 0.31, 0.97);-o-transition: all 0.4s cubic-bezier(0.05, 0.05, 0.31, 0.97);-webkit-transition: all 0.4s cubic-bezier(0.05, 0.05, 0.31, 0.97);transition: all 0.4s cubic-bezier(0.05, 0.05, 0.31, 0.97);}
a:hover { opacity: 0.6; }
.clearfix:after { content: ''; display: block; clear: both; }
.pc { display: none; }
.sp { display: block; }
img {max-width:100%;width: 100%;}

/* font */
:root {
--mincho:"游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "MS P明朝", serif;
--gothic: 游ゴシック体, YuGothic, 'Yu Gothic', "游ゴシック Medium", "Yu Gothic Medium", 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
}

/* header
----------------------------------------------- */
.header{width: 100%;position: absolute;z-index: 1;}
.hero{position: relative;}

/* btn
----------------------------------------------- */
.btn{padding: 8% 2% 0%;}
.btn a{padding: 0;}
.yureru-updown {animation: yureru-updown 2s infinite;}
@keyframes yureru-updown {0% {transform: translate(0px, 3px);}5% {transform: translate(0px, -3px);}10% {transform: translate(0px, 3px);}15% {transform: translate(0px, -3px);}20% {transform: translate(0px, 3px);}25% {transform: translate(0px, -3px);}30% {transform: translate(0px, 0px);}}

/* contents
----------------------------------------------- */
.trial-gallery {width: 90%;margin: 10vw auto 0;}
.trial-gallery p{background: #ddd;padding: 2vw;text-align: center;margin-bottom: 4vw;font-size: 3.2vw;}
.trial-gallery ul {display: -webkit-flex;display: flex;-webkit-flex-wrap: wrap;flex-wrap: wrap;-webkit-justify-content: flex-start;justify-content: flex-start;-webkit-align-items: flex-start;align-items: flex-start;gap: 0 3vw;}
.trial-gallery ul li {position: relative;margin-bottom: 4%;width: -webkit-calc((100% - 6vw) / 3);width: calc((100% - 6vw) / 3);}
.trial-gallery li a:after { content: ''; display: inline-block; width: 24px; height: 24px; background-image: url(../images/zoom.jpg); background-size: contain; vertical-align: middle; position: absolute; right:0; bottom:0;}
.trial-gallery ul li img {width:100%;margin-bottom: 0;}

.books{padding: 15vw 0 18vw;position: relative;}
.books .tit{width: 38%;margin: 0 auto;}
.books .slick-prev, .books .slick-next{width: 12vw;margin: 0;}
.books-img{width: 58vw;margin: 0 4vw;}

.flow{padding-top: 14%;}
.introduction{margin-top: 10%;}
.benefits02{position: relative;margin-bottom: 10vw;}
.benefits02 a{position: absolute;bottom: 4%;padding: 2%;}
.review{position: relative;padding-bottom: 18vw;background-color: #fcf9f4;}
.review a{position: absolute;bottom: 5vw;width: 66vw;left: 50%;-webkit-transform: translateX(-50%);transform: translateX(-50%);}

/* footer
----------------------------------------------- */
.footer{position: relative;padding-bottom: 0;background: #021230;}
.footer a{position: absolute;bottom: 4%;padding: 2%;}
.site-footer{background: #021230;color: #fff;text-align: center;padding: 8vw 4vw 28vw;font-size: 3vw;line-height: 1.8;}
.site-footer__nav{display: flex;justify-content: center;align-items: center;flex-wrap: wrap;gap: 0 6vw;margin-bottom: 3vw;}
.site-footer__nav a{display: inline;color: #fff;font-size: 3.2vw;}
.site-footer__nav a:hover{opacity: 0.7;}
.site-footer__copy{color: rgba(255,255,255,0.75);font-size: 2.6vw;letter-spacing: 0.02em;}
.fixed{position: fixed;z-index:25;bottom:0;}


/* =============================================
pc-size
================================================*/
@media screen and (min-width: 769px) {
body{font-size: 16px;}
.pc { display: block; }
.sp { display: none; }
#top{max-width: 2000px; margin: 0 auto;}

/* btn
----------------------------------------------- */
.btn{width: 70%;margin: 0 auto;max-width: 900px;padding: 80px 0;}

/* header
----------------------------------------------- */
.header{background: url(../images/header-pc.jpg) no-repeat top center;background-size: 160%;padding: 4% 0;transform: translateX(-50%);left: 50%;}
.hero{background: url(../images/hero-pc.jpg) no-repeat top center;background-size: 160%;padding: 36.6% 0;}

/* contents
----------------------------------------------- */
.benefits01{background: url(../images/benefits01-pc.jpg) no-repeat top center;background-size: 160%;padding: 42% 0;margin-bottom: 100px;}
.trial{width: clamp(730px, 90%,960px);margin: 0 auto;}
.trial img{margin-bottom: 70px;}

.trial-gallery {width: clamp(730px ,90%,900px);margin: 0 auto;}
.trial-gallery p{padding: 12px;margin-bottom: 30px;font-size: 14px;}
.trial-gallery ul {gap: 0 30px;}
.trial-gallery ul li {margin-bottom: 30px;width: -webkit-calc((100% - 60px) / 3);width: calc((100% - 60px) / 3);}
.trial-gallery ul li img {width:100%;margin-bottom: 0;}

.media{background: url(../images/media-pc.jpg) no-repeat top center;background-size: 160%;padding: 56% 0;margin: 100px 0 0;}
.patent{background: url(../images/patent-pc.jpg) no-repeat top center;background-size: 160%;padding: 22% 0;}
.author{background: url(../images/author-pc.jpg) no-repeat top center;background-size: 160%;padding: 71% 0;}
.books{padding: 0 0 10%;}
.books .tit{width: 160px;}
.books-img{width: 220px;margin: 0 50px;}
.books .slick-prev, .books .slick-next{width: 65px;margin: 0;}
.flow{background: url(../images/flow-pc.jpg) no-repeat top center;background-size: 160%;padding: 14% 0;margin-top: 6%;}
.sheet{background: url(../images/sheet-pc.jpg) no-repeat top center;background-size: 160%;padding: 30% 0;margin-top: 10%;}

.introduction{background: url(../images/introduction-pc.jpg) no-repeat top center;background-size: 160%;padding: 52% 0;margin-top: 70px;}
.benefits02{background: url(../images/benefits02-pc.jpg) no-repeat top center;background-size: 160%;padding: 52.5% 0;margin-bottom: 100px;}
.benefits02 a{width: 70%;max-width: 900px;transform: translateX(-50%);left: 50%;bottom: 10%;padding: 0;}
.review{background: #fcf9f4 url(../images/review-pc.jpg) no-repeat top center;background-size: 160%;padding: 70.5% 0 120px;}
.review a{width: 40%;max-width: 489px;left: 50%;-webkit-transform: translateX(-50%);transform: translateX(-50%);bottom: 32px;}
.worries{background: url(../images/worries-pc.jpg) no-repeat top center;background-size: 160%;padding: 47% 0;margin-top: 10%;}
.voice{background: url(../images/voice-pc.jpg) no-repeat top center;background-size: 160%;padding: 48% 0;}
.gallery{background: url(../images/gallery-pc.jpg) no-repeat top center;background-size: 160%;padding: 49% 0;}

.learning{background: url(../images/learning-pc.jpg) no-repeat top center;background-size: 160%;padding: 60% 0;}
.btn{width: 70%;margin: 0 auto;max-width: 900px;padding: 50px 0 0;}

/* contents
----------------------------------------------- */
.footer{background: url(../images/footer-pc.jpg) no-repeat top center;background-size: 160%;padding: 32% 0;}
.footer a{width: 70%;max-width: 900px;transform: translateX(-50%);left: 50%;bottom: 13%;padding: 0;}
.site-footer{padding: 40px 20px 60px;font-size: 14px;}
.site-footer__nav{gap: 0 40px;margin-bottom: 12px;}
.site-footer__nav a{font-size: 14px;}
.site-footer__copy{font-size: 12px;}
}

@media screen and (min-width: 1250px) {
.header{background-size: 2000px;padding: 50px 0;}
.hero{background-size: 2000px;padding: 457px 0;}
.benefits01{background-size: 2000px;padding: 530px 0;}
.media{background-size: 2000px;padding: 690px 0;margin-top: 100px;}
.patent{background-size: 2000px;padding: 292px 0;}
.author{background-size: 2000px;padding: 888px 0;}
.books{padding: 0 0 130px;}
.flow{background-size: 2000px;padding: 175px 0;margin-top: 110px;}
.sheet{background-size: 2000px;padding: 365px 0;margin-top: 110px;}
.introduction{background-size: 2000px;padding: 665px 0;}
.benefits02{background-size: 2000px;padding: 630px 0;}
.benefits02 a{width: 90%;bottom: 90px;}
.review{background-size: 2000px;padding: 881px 0 130px;}
.review a{width: 492px;-webkit-transform: translateX(-50%);transform: translateX(-50%);bottom: 36px;}
.worries{background-size: 2000px;padding: 585px 0;margin-top: 100px;}
.voice{background-size: 2000px;padding: 590px 0;}
.gallery{background-size: 2000px;padding: 620px 0;}
.learning{background-size: 2000px;padding: 745px 0;}
.footer{background-size: 2000px;padding: 390px 0;}
.footer a{bottom: 70px;}
}

/* =============================================
 retina-size
================================================*/
@media screen and (min-width: 769px) and (-webkit-min-device-pixel-ratio: 2), screen and (min-width: 769px) and (min-resolution: 2dppx) {
.header{background-image: url(../images/header-pc@2x.jpg);}
.hero{background-image: url(../images/hero-pc@2x.jpg);}
.benefits01{background-image: url(../images/benefits01-pc@2x.jpg);}
.media{background-image: url(../images/media-pc@2x.jpg);}
.patent{background-image: url(../images/patent-pc@2x.jpg);}
.author{background-image: url(../images/author-pc@2x.jpg);}
.flow{background-image: url(../images/flow-pc@2x.jpg);}
.sheet{background-image: url(../images/sheet-pc@2x.jpg);}
.introduction{background-image: url(../images/introduction-pc@2x.jpg);}
.benefits02{background-image: url(../images/benefits02-pc@2x.jpg);}
.review{background-image: url(../images/review-pc.jpg);}
.worries{background-image: url(../images/worries-pc@2x.jpg);}
.voice{background-image: url(../images/voice-pc@2x.jpg);}
.gallery{background-image: url(../images/gallery-pc@2x.jpg);}
.learning{background-image: url(../images/learning-pc@2x.jpg);}
.footer{background-image: url(../images/footer-pc@2x.jpg);}
}