@charset "UTF-8";
:root {--mincho: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "MS P明朝", serif;--gothic: 'Noto Sans Japanese', 游ゴシック体, YuGothic, 'Yu Gothic', "游ゴシック Medium", "Yu Gothic Medium", 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;;}
.pc { display: block; }
.sp { display: none; }

.midashi04 { margin-bottom: 50px; text-align: center; }
.midashi04 span { display: block; }
.midashi04 .en { margin-bottom: 10px; font-size: 42px; font-family: 'Cinzel'; }
.midashi04 .jp { margin-left: 10px; font-family: var(--mincho); letter-spacing: 0.2em; }

.rakine-title { margin-bottom: 40px; text-align: center; }
.rakine-title span { display: block; }
.rakine-title .en { font-size: 40px; }
.rakine-title .jp { font-family: var(--mincho); font-size: 24px; }
.rakine-title small { display: block; font-size: 80%; line-height: 1.2; }

.nittei .schedule-title { margin-bottom: 10px; padding: 10px 0;  color: #fff; font-weight: bold; text-align: center; background: #000; }

.nittei { margin-bottom: 100px; position: relative; }
.nittei::after {content: '';width: 0.5px;height: 70px;background: #000;position: absolute;left: 50%;bottom: -80px;-webkit-animation: scroll-line 3.5s cubic-bezier(0.76, 0.06, 0, 1) infinite forwards;animation: scroll-line 3.5s cubic-bezier(0.76, 0.06, 0, 1) infinite forwards;}
@-webkit-keyframes scroll-line { 0% { -webkit-transform-origin: top left; transform-origin: top left; -webkit-transform: scaleY(0); transform: scaleY(0); }
50% { -webkit-transform-origin: top left; transform-origin: top left; -webkit-transform: scaleY(1); transform: scaleY(1); }
75% { -webkit-transform-origin: bottom left; transform-origin: bottom left; -webkit-transform: scaleY(1); transform: scaleY(1); }
100% { -webkit-transform-origin: bottom left; transform-origin: bottom left; -webkit-transform: scaleY(0); transform: scaleY(0); } }
@keyframes scroll-line { 0% { -webkit-transform-origin: top left; transform-origin: top left; -webkit-transform: scaleY(0); transform: scaleY(0); }
50% { -webkit-transform-origin: top left; transform-origin: top left; -webkit-transform: scaleY(1); transform: scaleY(1); }
75% { -webkit-transform-origin: bottom left; transform-origin: bottom left; -webkit-transform: scaleY(1); transform: scaleY(1); }
100% { -webkit-transform-origin: bottom left; transform-origin: bottom left; -webkit-transform: scaleY(0); transform: scaleY(0); } }

.flex .intro-text-area { width: 48%; }
.flex .intro-text-title { margin-bottom: 10px; padding: 10px; font-size: 20px; font-family: var(--mincho); border-bottom: 1px solid #000; border-left: 8px solid; }
.flex { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; -webkit-align-items: center; align-items: center; -webkit-flex-wrap: wrap; flex-wrap: wrap; }

.intro .flex img { width: 46%; }
.intro .flex:nth-child(2) img { order: -1; }

.features { margin-bottom: 50px; }
.features .features-text { padding: 10px 0; color: #fff; font-size: 20px; font-family: var(--mincho); text-align: center; background: #000; }

.about .curriculum_box .in { width: 100%; }
.about .midashi04 { margin-bottom: 30px; }
.about .midashi04 .jp { font-size: 30px; }
.about .flex > div { width: 48%; }
.about .flex img { width: 40%; }

.contact p { text-align: center; }
.contact-area { width: 960px; padding: 40px; margin: 0 auto 120px; border: 1px solid #222; }
.contact-area .contact-area-title { font-size: 30px; font-family: var(--mincho); font-weight: 600; text-align: center; }
.contact-area .flex { display:-webkit-box; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; -webkit-align-items: center; align-items: center; -webkit-flex-wrap: wrap; flex-wrap: wrap; }
.contact-area .flex div{ width: 420px; }
.contact-area .ttl { margin-bottom: 20px; padding-bottom: 10px; font-size: 18px ;border-bottom: 1px solid #222; }
.contact-area .name { font-size: 24px; }
.contact-area a { color: #897646; font-size: 20px; text-decoration: none; }
.contact-area a.number { font-size: 30px; }
.contact-area img { width: 420px; }

/* sp
------------------------------------------------------------------*/
@media screen and (max-width: 736px) {

.pc { display: none; }
.sp { display: block; }

.hero .midashi01 .jp { font-size: 4.2vw; }
.midashi04 { font-size: 6vw; margin-bottom: 6vw; line-height: 1.4; }
.midashi04 .en { display: block; margin-bottom: 0; font-size: 8vw; }
.midashi04 .jp { margin-left: 0; font-size: 4.6vw; }

.body { width: 90%; margin: 0 auto; padding-top: 4vw; }
.body .intro > div p { padding: 3% 0; font-size: 3.5vw; line-height: 1.8; }

.intro-top::after {height: 60px;bottom: -34vw;}

@-webkit-keyframes scroll-line { 0% { -webkit-transform-origin: top left; transform-origin: top left; -webkit-transform: scaleY(0); transform: scaleY(0); }
50% { -webkit-transform-origin: top left; transform-origin: top left; -webkit-transform: scaleY(1); transform: scaleY(1); }
75% { -webkit-transform-origin: bottom left; transform-origin: bottom left; -webkit-transform: scaleY(1); transform: scaleY(1); }
100% { -webkit-transform-origin: bottom left; transform-origin: bottom left; -webkit-transform: scaleY(0); transform: scaleY(0); } }
@keyframes scroll-line { 0% { -webkit-transform-origin: top left; transform-origin: top left; -webkit-transform: scaleY(0); transform: scaleY(0); }
50% { -webkit-transform-origin: top left; transform-origin: top left; -webkit-transform: scaleY(1); transform: scaleY(1); }
75% { -webkit-transform-origin: bottom left; transform-origin: bottom left; -webkit-transform: scaleY(1); transform: scaleY(1); }
100% { -webkit-transform-origin: bottom left; transform-origin: bottom left; -webkit-transform: scaleY(0); transform: scaleY(0); } }

.rakine-title { margin-bottom: 8vw; }
.rakine-title span { display: block; }
.rakine-title .en { font-size: 8vw; }
.rakine-title .jp { font-size: 6vw; }


.nittei { width: 90%; margin: 0 auto 25vw; position: relative; }
.nittei::after {content: '';width: 0.5px;height: 70px;background: #000;position: absolute;left: 50%;bottom: -80px;-webkit-animation: scroll-line 3.5s cubic-bezier(0.76, 0.06, 0, 1) infinite forwards;animation: scroll-line 3.5s cubic-bezier(0.76, 0.06, 0, 1) infinite forwards;}
.nittei .schedule-title { margin-bottom: 2vw; padding: 2vw 0; font-size: 4.6vw; }

.flex { margin-bottom: 6vw; }
.flex .intro-text-area { width: 100%; }
.flex .intro-text-title { margin-bottom: 2vw; padding: 2vw; font-size: 5vw; }

.intro { width: 90%; margin: auto; }
.intro .flex img { width: 100%; }
.intro .flex:nth-child(2) img { order: 1; }
.intro-text-title { font-size: 4vw; }

.features { margin-bottom: 10vw; }
.features .features-text { padding: 2vw 0; color: #fff; font-size: 4.6vw; }


.seminer .about { width: 90%; margin: 0 auto 0; }
.about .curriculum_box .in { width: 100%; }
.about .midashi04 { margin-bottom: 6vw; }
.about .midashi04 .jp { font-size: 4.6vw; }
.about .flex > div { width: 100%; }
.about .flex img { width: 100% }

.contact-area {width: 90%;margin: 0 auto 20%;padding: 6%;}
.contact-area .contact-area-title { font-size: 6vw; text-align: left; }
.contact-area .flex div {width: 100%;margin-bottom: 6%;}
.contact-area .ttl {margin-bottom: 4%;padding-bottom: 2%;font-size: 4.2vw;}
.contact-area a {font-size: 4.2vw;}
.contact-area a.number {font-size: 7vw;}
.contact-area p.name {padding: 0; font-size: 3.5vw;}
.contact {margin-bottom: 8%;padding: 0 3%;}
.contact ul { padding: 0; }
.contact li {width: 100%;margin-bottom: 2%;padding: 4%;}
.contact li a {font-size: 4vw;}
.contact li::after {right: 4%;}
.news .seminer .contact ul li:after { top: 33px; }
.contact p { padding: 0; }
.tel {width: 100%;margin: 0 auto;padding: 4%;}
.tel .ttl {margin-bottom: 2%;padding-bottom: 2%;font-size: 5vw;}
.tel a {margin-left: 16%;font-size: 6vw;}
.tel .sub {font-size: 3.6vw;margin-left: 6%;padding: 2% 0 4%;}

.message {width: 100%;margin: 0 auto 40px;padding: 20px;border: 2px solid #f2eac4;}
.message p {margin-bottom: 4vw;font-size: 3.6vw;}
.message span {margin-bottom: 4vw;padding-bottom: 2vw;font-size: 5.2vw;display: block;border-bottom: 1px dashed #ccc}

}
