
/*** Spinner ***/
#spinner {opacity: 0;visibility: hidden;transition: opacity .5s ease-out, visibility 0s linear .5s;z-index: 99999;background:whitesmoke; &.show {transition: opacity .5s ease-out, visibility 0s linear 0s;visibility: visible; opacity: 1;} .spinner-border { width: 5rem;height: 5rem;color:var(--og);}}
/*** Settings ***/
body {font-family: -apple-system, "Noto Sans JP", "BIZ UDPGothic", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif; font-size: .85rem;letter-spacing: .1rem;line-height: 1.75;color: var(--Bl);word-break: break-word;-webkit-text-size-adjust: 100%;background:var(--Be);}
html {scroll-behavior: smooth;}
a {-webkit-tap-highlight-color: var(--tra);touch-action: manipulation;color: var(--Bl);text-decoration: none; transition: color 0.2s ease, outline 0.2s ease;}
a:hover,a:focus { color: var(--og); outline: none;}
a:active { color: var(--og);}
a:focus-visible {outline: 2px dashed var(--og); outline-offset: 4px;}
ul{margin-bottom: .5rem;}li{list-style: none;}
header {display: inline;background:var(--tra);}
section {padding:5rem 0;}
img {max-width: 100%; height: auto; vertical-align: middle; font-style: italic; background-repeat: no-repeat; background-size: cover; shape-margin: 0.75rem;}
main,.hero {max-width: 1400px;margin: auto;}
:root {
  --Wh:#fff;
  --Bl:#000;
  --Be:#efe7e1;
  --og:#f68666;
  --sk:#80a4db;
  --bb:#ddd1c8;
  --sen:#9fc177;
  --sOra:#f6947a;
  --sYel:#f8bb51;
  --sPeal:#b1cadf;
 --Pk:#ff557d;
  --pap:#f09a8c;
  --ope:#90a2f6;
  --apt:#98c0cf;
  --pup:#ae9ec0;
  --con:#12143a;
  --gold:#cdb889;
  --Gr:#e4e3ec;
--fix:fixed;
--abs:absolute;
--rel: relative;
--flx: flex;
--tra:transparent;
--ce:center;
--tr5: .5s;
}
/******* Commons *******/
.img-shadow {border-radius: 4rem;box-shadow: 0px 35px 50px -25px rgba(70, 84, 109, .6);}
.number {font-family: Century Gothic, sans-serif;font-weight: 900;}
#order,#course01,#course02,#li01,#li02,#li03,#li04,#li05,#li06,#li07,#li08,#li09,#li10{ display: block;padding-top: 100px;margin-top: -100px;}
.disno {display: none;}
.gap-4 {gap: 1.5rem !important;}
/*** Phone ***/
.phone {text-align: var(--ce);color:var(--Bl);padding:0 .1rem;font-size:1.2rem;font-family: Century Gothic, sans-serif;font-weight: 900;letter-spacing: .05rem;}
.phone span{font-size: 1rem;}
.phone p {font-size:.7rem;font-weight: normal;margin-bottom:0;line-height: 0.5rem;}
/* Back to Top */
.back-to-top { display: var(--flx); align-items: var(--ce);
 justify-content: var(--ce); width: 3.5rem; height: 3.5rem; background: var(--Bl); color: var(--Wh); border-radius: 50%; text-decoration: none;font-size: 1rem;
position:  var(--fix); bottom: .5rem; right: .5rem;}
.back-to-top:hover {background:var(--Bl);color:var(--Wh);}
/*-----*/
:root {
  --ski:#A9BFA3;
  --skiO:#e25040;
  --skiG:#52695f;
}
.skill .hero h1,.consulting .hero h1 { padding: .5rem 2rem 4rem;}
.skill .hero div,.consulting .hero div {padding: 5rem 0 0;}
.skill .hero text,.skill .disArea text,.consulting .hero text,.consulting .disArea text {fill:var(--gold);}
.skill .con01,.skill .con01 > div:first-child,.consulting .con01,.consulting .con01 > div:first-child {background: var(--Be);padding:1rem;}
.skill .mainB,.consulting .mainB {background-image:linear-gradient(transparent 40%, var(--Wh) 40%, var(--Wh) 50%, var(--Be) 50%);background-color: var(--Be);}
.skill .orderBtn,.consulting .orderBtn {background: #F2A488;color:var(--Bl);}
.skill .lead,.consulting .lead {font-weight: 500;padding:3rem 2rem;}
.skill .text-start,.consulting .text-start {padding:2rem;}
.worries p {background: var(--Wh);padding: 1rem .5rem;font-size: .9rem;text-align: center;font-weight: 500;border-radius: 2rem;margin: 1rem auto;box-shadow: 0px 30px 45px -20px rgba(104, 104, 104, 0.4);margin-bottom: 2rem;}
.worries p b {font-weight: 600;font-size: 1.1rem;}
.worries p span {display: block;padding-bottom: .5rem;text-align: center;}
.worries p span img {width: 50px;}
.fukuTtl { display: flex;justify-content: center;align-items: center;font-size: 1.2rem;font-weight: 600;padding-top:2rem;}
.fukuTtl::before,.fukuTtl::after {
    content: "";height: 1px;width: 25px;margin-top: 1rem;}
.fukuTtl::before {margin-right: 1rem;transform: rotate(60deg); }
.fukuTtl::after {margin-left: 1rem;transform: rotate(-60deg);}
.skillNav .n-icon {text-align:center;padding:.5rem;aspect-ratio: 1;width: 150px;border-radius: 50%;margin: 1rem auto 0;text-align: center;}
.skillNav .sk01 .n-icon,.skillNav .sk01 .n-det {background:#ffbca4;}
.skillNav .sk02 .n-icon,.skillNav .sk02 .n-det {background:#c4d3bf;}
.skillNav .sk03 .n-icon,.skillNav .sk03 .n-det {background:#cae0e0;}
.skillNav .sk04 .n-icon,.skillNav .sk04 .n-det {background:#f1f0c7;}
.skillNav .n-icon img {width: 80%;}
.skillNav .n-det {margin-top: -5rem;padding:3rem 1rem 1rem;border-radius: 1rem;}
.skillNav h2 {text-align: center;padding:.8rem 0 .5rem;font-size:1.4rem;font-weight: 600;}
.skillNav .btn {background: var(--Wh);font-size: .9rem;}
.skicon02 h2,.skicon02 h3 {font-weight: 600;text-align: center;}
.skicon02 h3 {font-size: 1.8rem;margin: 1rem 0;}
.skill {background:var(--ski);}
.skill .nav-bar {background:rgb(169, 191, 163,.7);}
.skill .hero {background-image: url(../img/skTopBg.webp),linear-gradient(0deg, #efe7e1 30%, #a9bfa3 30%);background-repeat: no-repeat;background-position: top right,top left;background-size: 70%, 100%;}
.skill .mainB,.skill .con01,.skill .con01 > div:first-child {color:var(--skiG);}
.skill .h-02::before {z-index: 1;background-image: radial-gradient(circle, var(--skiG) 2px, var(--tra) 2px);}
.skill .con02 {background: var(--Wh);}
.skill .con03 {background: #F2A488;}
.skill .worries p {color:var(--skiG);}
.skill .worries p b {color:var(--skiO);}
.skill .fukuTtl {color:var(--skiO);}
.skill .fukuTtl::before,.fukuTtl::after {background-color: var(--skiO);}
.skicon01 {color:#1a191b;background: var(--Wh);}
.skill .lead b {color:var(--skiO);}
.skill .skicon02,.skill .skiCo02 h2 {color:var(--skiG);}
.skill .skicon02 h3 {color:var(--skiO);}
.skiCo01 {background:var(--Be);}
.skiCo02 {background:#A9BFA3;}
.skill .skiCo02 h3,.skiCo02 > .fukuTtl {color: #b93535;}
.skiCo02 > .fukuTtl::before,.skiCo02 > .fukuTtl::after {background: #b93535;}
:root {
  --cons:#9faabd;
  --consB:#0a204d;
  --consP:#fc5858;
}
.consulting {background:var(--cons);}
.consulting .nav-bar {background:rgb(163, 167, 191, .7);}
.consulting .hero {background-image: url(../img/cTopBg.webp),linear-gradient(0deg, #efe7e1 30%, var(--cons) 30%);background-repeat: no-repeat;background-position: top right,top left;background-size: 70%, 100%;}
.consulting .mainB,.consulting .con01,.consulting .con01 > div:first-child {color:var(--consB);}
.consulting .h-02::before {z-index: 1;background-image: radial-gradient(circle, var(--consB) 2px, var(--tra) 2px);}
.consulting .worries p {color:var(--consB);}
.consulting .worries p b {color:var(--consP);}
.consulting .fukuTtl {color:var(--consP);}
.consulting .fukuTtl::before,.fukuTtl::after {background-color: var(--consP);}
.consulting .lead b {color:var(--consP);}
.consulting .skicon02,.consulting .skiCo02 h2 {color:var(--consB);}
.consulting .skicon02 h3 {color:var(--consP);}
.consulting .skiCo01 .lead {font-size: 1.2rem;padding:4rem 0;font-weight: 600;line-height: 2.5rem;}
.consulting .skiCo01 .lead b{font-size: 1.5rem;font-weight: 600;display: block;}
.consulting .disArea { background: linear-gradient(var(--Wh) 50%, var(--cons) 50%);}
.consulting .orderBox {background: var(--cons);}
.nav-bar {transition: 1s;padding: .5rem 2rem;background:rgb(239, 231, 225, .7);}
.navbar-brand img {max-height: 28px;transition: var(--tr5);padding:0;}
.nav-bar .oBtn {font-weight: 500;border-radius: 2rem;background:var(--Bl);color:var(--Wh);padding:.7rem 1rem;margin: .2rem .5rem;text-align: center;font-size:.8rem;line-height: 1.2rem;}
.nav-bar .oBtn:is(:hover, :active) {transform: translateY(-2px); box-shadow: 0 .5rem 1rem -.1rem rgb(0 0 0 / 30%), 0 0 10px rgb(0 0 0 / 30%);background:var(--og);}
.unkou .nav-bar .oBtn,.consulting .nav-bar .oBtn {font-size:.8rem;line-height: 1.2rem;}
@media (width <= 576px) {
.nav-bar .oBtn {font-size: .75rem;padding:.3rem 1rem;border-radius: 1.2rem;line-height: 1.1rem;}
.senior .nav-bar .oBtn,.tekisei .nav-bar .oBtn {font-size: .75rem;}
.paper .nav-bar .oBtn {font-size: .68rem;letter-spacing: 0;}
.unkou .nav-bar .oBtn,.consulting .nav-bar .oBtn {font-size:.7rem;line-height: 1.1rem;padding:.3rem;}
}
.senior .hero {background: url(../img/sTopBg.webp) no-repeat top right / 70%;}
.paper .hero {background: url(../img/pTopBg.webp) no-repeat top right / 70%;}
.unkou .hero {background: url(../img/uTopBg.webp) no-repeat top right / 70%;}
.tekisei .hero {background: url(../img/tTopBg.webp) no-repeat top right / 70%;}
.hero div {padding:5rem 0;position: var(--rel);background:transparent;}
.hero div::before{position: var(--abs);content: "";top:5%;left:3%; height:330px; aspect-ratio: 1; border-radius: 50%; box-sizing: border-box;z-index: -1;}
.senior .hero div::before{background: var(--sen);} 
.paper .hero div::before{background: var(--pap);} 
.unkou .hero div::before{background: var(--ope);} 
.tekisei .hero div::before{background: var(--apt);} 
.hero h1 {font-size:1.3rem;letter-spacing: .1rem;padding: 3rem 2rem;}
.hero h1 span{font-size:3.5rem;display: block;line-height: 5rem;font-weight: 600;letter-spacing: .5rem;}
.hero svg {padding:0 2rem 2rem 0;max-width: 1000px;}
.senior .hero h1 span{font-size:3.5rem;}
.paper .hero h1 span{font-size:2.5rem;}
.unkou .hero h1 span{font-size:3rem;}
.mainB {background:linear-gradient(transparent 40%, var(--Wh) 40%, var(--Wh) 50%, var(--sPeal) 50%);padding:0;}
.tekisei .mainB {background:linear-gradient(transparent 40%, var(--Wh) 40%, var(--Wh) 50%, #adc3a1 50%);}
.tekisei .con01,.tekisei .orderBox{background: #adc3a1;}
.tekisei .disArea {background:linear-gradient(transparent 50%, #adc3a1 50%);}
.unkou .mainB {background:linear-gradient(transparent 40%, var(--Wh) 40%, var(--Wh) 50%, #c0d3e5 50%);}
.unkou .con01,.unkou .orderBox {background: #c0d3e5;}
.unkou .disArea {background:linear-gradient(transparent 50%, #c0d3e5 50%);}
.mainB .col-10 {background:linear-gradient(transparent 30%, var(--Wh) 30%);border-radius: 4rem;padding:0 3rem 2rem;}
.mainB .col-10 div {background:var(--Be);border-radius: 3rem;padding:1.5rem;}
.h-01 {font-weight: 600;font-size: 2rem;text-align: center;padding:1rem 0 .5rem;}
.h-02 {font-weight: 600;font-size: 1.2rem;line-height: 2.2rem;position: var(--rel);margin:0 0 3rem;padding:2rem 0 .5rem;display: flex;align-items: var(--ce); justify-content:var(--ce);}
.h-02::before { content: '';z-index:-1;bottom:-1.5rem;width: 100px;height:5px;position: absolute; z-index: 1;background-image: radial-gradient(circle, var(--Bl) 2px, var(--tra) 2px);background-position: left center; background-repeat: repeat-x; background-size: 20px 10px;}
.h-03 {font-weight: 600;font-size: 1.2rem;text-align: center;padding:1rem 0;}
.h-04 {padding:1rem 0;font-size: 1.4rem;font-weight: 600;line-height: 2.4rem;}
.h-04 span {font-size:4rem;font-weight: 800;}
.h-05 {text-align: center;padding:1rem 0;font-size: 1.4rem;font-weight: 600;line-height: 2.4rem;}
.h-05 span img {max-width: 60px;display: block;margin: 0 auto;padding-bottom: .5rem;}
.h-06 {position: var(--rel);margin:0 0 .5rem;padding:.5rem 0;font-size: .8rem;}
.h-06::before { content: '';z-index:-1;bottom:-.2rem;width: 100%;height:3px; position: absolute; z-index: 1;background-image: radial-gradient(circle, #49525b 1.2px, var(--tra) 1.2px);background-position: left center; background-repeat: repeat-x; background-size: 10px 5px;}
.h-07 {background: var(--Be);border-radius: 2rem;padding:.5rem 2rem 1rem;font-size: .8rem;font-weight: 800; letter-spacing: .05rem;display: table;margin:4rem auto 2.5rem;}
.h-07 span {font-size: 1.1rem;font-weight:600;}
.h-07 span::before {content: "/";font-size: 25px;font-weight: 100;margin: 0 .5rem;}
.attn {font-size: .75rem;padding-top:1rem;}
.attnB {font-size: .8rem;background: var(--Bl);color:var(--Wh);border-radius: 2rem;padding:1.5rem 2rem;}
.attnB b {font-size: .9rem;padding-bottom:.5rem;display: block;font-weight: normal;}
.con01 {background:var(--sPeal);}
.con01 > div:first-child {background:var(--Wh);border-radius: 2rem;padding:2rem;margin-bottom: 3rem;}
.con02 {background: var(--Be);padding:1rem;}
.con02 div div {padding:0 2rem;}
.con03 {text-align: center;padding:3rem 0;}
.con03 h2 {font-weight: 600;font-size: 1.8rem;padding:2rem 0;line-height: 2.8rem;}
.con04,.con05,.con06, .con07, .con08 {padding:2rem;margin: 0;}
.con04,.con06, .con08 {margin-left:3rem;border-radius: 3rem 0 0 3rem;}
.con04 h2,.con05 h2,.con06 h2,.con07 h2,.con08 h2 {text-align: center;margin-bottom: 1rem;}
.con05,.con07 {margin-right:3rem;border-radius: 0 3rem 3rem 0;}
.disArea {background:linear-gradient(transparent 50%, var(--sPeal) 50%);padding:0;}
.disArea div{text-align: right;}
.disArea div img{width: 80%;}
.disArea svg {padding:0 5rem 2rem 0;margin-top: -8rem;max-width: 1000px;}
.disArea-sd { background: url(../img/photo02.webp) no-repeat top center/ cover;width: 100%;height:400px;display: block;}
.bnArea {background: var(--bb);padding: 2rem;}
.bnArea div{padding: 1rem;}
.bnArea div a {display: inline-block;background: transparent;border-radius: 2rem;}
.bnArea div a img{border-radius: 2rem;}
.priceBox {background: var(--Wh);border-radius: 2rem;padding:1rem 1rem 2rem;text-align: center;margin: 2rem 0;font-weight: 600;}
.priceBox p {font-size: 1rem;}
.priceBox p.detail {font-size:.85rem;font-weight: 400;padding:1rem;text-align: left;}
.priceBox p.detail b {font-size:.9rem;font-weight: 600;line-height: 1.8rem;display: block;padding-top: 1rem;}
.priceBox p.detail b span{font-size:.75rem;font-weight: 500;background:#F2A488;color:var(--Wh);line-height: 1.6rem;padding:0 1rem;margin-right:1rem;}
div.courseCon {background: var(--Be);font-size: 1.4rem;text-align: center;border-radius: 2rem;padding:1rem 3rem;display: inline-block;}
.priceBox div:last-child {font-size: 1.2rem;}
.priceBox span {color:var(--Pk);font-size: 4rem;font-weight: 900;line-height: 5rem;}
.priceBox .det-list {font-size: .8rem;background: #25274d;color:var(--Wh);border-radius: 2rem;padding:1.5rem 2rem;font-weight: 400;text-align: left;margin: 1rem;}
.priceBox .det-list b {background: var(--Wh);color:#25274d;display: block;border-radius: 1rem;padding:.2rem .5rem;font-size:.8rem;margin:.5rem 0;text-align: center;}
.priceBox .det-list b:last-child{margin-top: 1rem;}
.orderBox {background: var(--sPeal);}
.miniNav a {font-size:.8rem;color:var(--Wh);}
.miniNav a:hover {color:var(--Bl);}
.infoArea {background: var(--og);padding-left:0;}
.infoArea h2 img{max-height:35px;margin-bottom:4rem;}
.infoCon p:first-child {color:var(--Wh);font-size:1rem;font-weight: 600;text-align: center;}
.infoCon h3 {color:var(--Wh);font-size:1.7rem;font-weight: 700;text-align: center;letter-spacing: .2rem;padding:0 0 2rem;line-height: 2.3rem;}
.infoCon h3 span {color:var(--Wh);font-size:1.2rem;}
.infoData {color:#49525b;background:var(--Wh);padding:2rem 2rem 1rem;border-radius: 2rem;font-size: .8rem;}
.infoData p {font-size: .7rem;}
.infoData .row {margin-top: 1rem;}
/***  Dotted Line ***/
.dot-x,.dot-xC { background-image: radial-gradient(circle, var(--Bl) 1px, transparent 1px);background-position: left bottom; background-repeat: repeat-x; background-size: 8px 2px;}
.dot-y,.dot-yC { background-image: radial-gradient(circle, var(--Bl) 1px, transparent 1px); background-position: right top; background-repeat: repeat-y; background-size: 2px 8px;}
/*** Button Start ***/
.btn { font-weight: normal;font-size:.8rem; transition: var(--tr5);border-radius: 1rem;margin-bottom:1rem;display: var(--flx); align-items: var(--ce); justify-content: var(--ce);}
.btn:is(:hover, :active),.orderBtn:is(:hover, :active),.phoneBtn:is(:hover, :active) {transform: translateY(-2px); box-shadow: 0 .5rem 1rem -.1rem rgb(0 0 0 / 30%), 0 0 10px rgb(0 0 0 / 30%);}
.btn-B { background:var(--Bl);color:var(--Wh);}
.btn-B:is(:hover, :active) { background:var(--sOra);color:var(--Wh);}
.btn-O { background:var(--sOra);}
.btn-Y { background:var(--sYel);}
.btn-S { background:var(--sk);color:var(--Wh);}
.btn-ski { background:var(--ski);color:var(--Wh);}
.btn-con { background:var(--con);color:var(--Wh);}
.btn-O:is(:hover, :active),.btn-Y:is(:hover, :active),.slcBtn:is(:hover, :active),.mapBtn:is(:hover, :active),.btn-S:is(:hover, :active),.bnArea div a:is(:hover, :active),.fBtn:is(:hover, :active),.btn-ski:is(:hover, :active),.btn-con:is(:hover, :active)
{ background:var(--Bl);color:var(--Wh);transform: translateY(-2px); box-shadow: 0 .5rem 1rem -.1rem rgb(0 0 0 / 30%), 0 0 10px rgb(0 0 0 / 30%);}
.orderBtn,.phoneBtn,.slcBtn {transition: var(--tr5);display:block;align-items: var(--ce); justify-content: var(--ce); cursor: pointer;color:var(--Bl);}
.orderBtn,.phoneBtn {border-radius: 2rem;margin-bottom:1rem;border-radius: 2rem;}
.orderBtn {font-weight: 600;font-size: 1.4rem;padding:.8rem;background: var(--sOra);}
.orderBtn img,.phoneBtn img {display: block;max-height:70px;margin: auto;}
.phoneBtn img {max-height:50px;}
.phoneBtn {font-weight: 900;font-size:1.8rem;letter-spacing: 0.05rem;padding:0.5rem 0 0;background: var(--sYel);}
.phoneBtn p {font-size: .75rem;font-weight: 500;padding:0;}
.orderBtn:is(:hover, :active),.phoneBtn:is(:hover, :active){background:var(--pup);color:var(--Bl);}
.slcBtn {border-radius: 3rem;padding:1rem 0;font-size: 1.4rem;font-weight: 600;}
.slcBtn span{font-size:4rem;font-weight: 800;}
.slcBtn span.sma{font-size:.8rem;font-weight: 500;display: block;}
.bg-sOra,.senior .con04 {background:var(--sOra);}
.bg-sYel,.senior .con05 {background:var(--sYel);}
.bg-sen,.senior .con06 {background:var(--sen);}
.bg-ora,.paper .con04 {background: #e3aba3;}
.bg-gre,.paper .con05 {background: #8ab38b;}
.bg-lye,.unkou .con04 {background:#e0cf67;}
.bg-log,.unkou .con05 {background:#ec9e25;}
.bg-lgr,.unkou .con06 {background:#9fb584;}
.bg-pB,.tekisei .con04 {background:#acc7d4;}
.bg-pY,.tekisei .con05 {background:#dcda90;}
.bg-pG,.tekisei .con06 {background:#bdd0a3;}
.bg-pP,.tekisei .con07 {background:#9f96ac;}
.bg-pO,.tekisei .con08 {background:#e9c1c1;}
.bg-Be {background: var(--Be);}
.bg-Go {background: #99a5e0;}
.bg-Ye {background: var(--sYel);}
.bg-Ap {background: var(--apt);}
.bg-Gol {background: #e0d2b6;}
.mapBtn,.fBtn,.btnMi:before {font-size:.7rem;}
.btnSm,.btnMi,.btnDl{border-radius: 2rem;}
.mapBtn {font-weight: normal;transition: var(--tr5);border-radius: 1rem; align-items: var(--ce);background: var(--og);color:var(--Wh);justify-content: var(--ce);display: inline-block;padding:.1rem 1rem;margin: .1rem .2rem;}
.fBtn {background: var(--Wh);padding:.5rem;margin:.5rem;}
.btnSm {font-size:.75rem; padding: .6rem .8rem;}
.btnMi {font-size:1rem; padding: 1rem 2rem 1rem;}
.btnDl {font-size:1rem; padding: 1rem 2rem 1rem;}
.btn:is(.btnMi, .btnSm, .btnDl) {position: var(--rel);}
.btn:is(.btnMi)::before,.btn:is(.btnDl)::before  {font-family: 'Font Awesome 5 Free';font-weight: 900;line-height: 1; position: var(--abs);margin: 0;padding: 0;}
.btnMi:before {top: calc(50% - .3rem); right: 1rem;content: '\f061';border-radius:50%;}
.btnDl:before {font-size: 1rem;top: calc(50% - .3rem); right: 1rem;content: '\f019';}
@media (width <= 767px) {
.dot-yC {background-image: radial-gradient(circle, var(--Bl) 1px, var(--tra) 1px);background-position: left bottom; background-repeat: repeat-x; background-size: 8px 2px;}
.dot-xC { background-image: radial-gradient(circle, var(--Bl) 1px, var(--tra) 1px);background-position: left bottom; background-repeat: repeat-x; background-size: 8px 2px;}
.hero h1 {padding: 4rem 1rem 3rem;text-shadow: 0 0 10px white,0 0 10px white, 0 0 10px white;}
.hero h1 span {font-size: clamp(3rem, 2.523rem + 2.036vw, 3.5rem);}
.hero svg{padding:1.5rem 1rem 1rem 0;}
.hero div {padding: 5rem 0 2rem;}
.hero div::before { top: 10%; left: -5%;}
.senior .hero,.paper .hero,.tekisei .hero,.consulting .hero,.skill .hero {background-size: 98%;}
.unkou .hero {background-position: top 2rem right -5rem;}
.unkou .hero h1 {padding:0rem 1rem 0rem;}
.unkou .hero h1 span {font-size:2.5rem;}
.hero svg { padding: 3rem 1rem 1rem 0; }
.mainB .col-10 { padding: 0 1rem 1rem;}
.disno {display: block;}
.gap-4 {gap: 1.2rem !important;}
.A-btn, .B-btn, .C-btn { border-radius: 2rem; padding: .5rem 0; font-size: 1rem;}
.A-btn span, .B-btn span, .C-btn span  {font-size: 3rem;}
.con04, .con06, .con08 { margin-left: 1.5rem;}
.con05 { margin-right: 1.5rem;}
.con04, .con05, .con06, .con07, .con08 {padding: 2rem 0;}
div.courseCon {font-size: 1.3rem;padding: 1rem}
.disArea div img { width: 98%;}
.disArea svg {padding:0 2rem 2rem 0;margin-top: -2rem;}
.infoCon {padding:2rem 1.5rem;}
.infoCon .btnMi,.oBtn {font-size: .8rem;}
.bnArea div{padding: .5rem;}
}
@media (width <= 576px) {
.hero h1 {padding: 4rem 0 0;}
.hero p,.disArea p {font-size:5rem;letter-spacing:.2rem;}
.hero div::before { top: 10%; left: -25%;}
.senior .hero,.tekisei .hero {background-size: 125%;background-position: top 2rem right -2rem;}
.paper .hero,.unkou .hero,.consulting .hero,.skill .hero{background-position: top 0 right -2rem;background-size: 140%;}
.unkou .hero h1 span{line-height: 4rem;}
.paper .hero h1 span{font-size:2.2rem;letter-spacing: .05rem;}
.paper .hero h1,.unkou .hero h1 {padding: 8rem 0 0;}
.paper .hero svg,.unkou .hero svg,.consulting .hero svg,.skill .hero svg,.navbar {padding: 0;}
.skill .hero h1, .consulting .hero h1 { padding: 5rem 0 0 .5rem;}
.consulting .hero h1 span,.skill .hero h1 span{font-size:2.5rem;letter-spacing: .05rem;line-height: 4rem;}
.gap-4 {gap: .6rem !important;}
.slcBtn {border-radius: 2rem;padding:.8rem 0;font-size: 1rem;}
.slcBtn span{font-size:3.4rem;}
.mainB { background: linear-gradient(transparent 40%, var(--Wh) 40%, var(--Wh) 45%, var(--sPeal) 45%);}
.nav-bar {padding:.2rem 1rem;}
}
@media (576px < width < 768px) {.nav-bar .oBtn { font-size: .8rem; border-radius: 2rem; padding: .5rem .6rem; margin: 0rem .5rem;}.navbar-brand img {max-height: 25px;}}
@media (1200px <= width) {.senior .hero,.paper .hero,.tekisei .hero,.unkou .hero{background-size: 60%;}}
/*** Footer ***/
.fData p,footer li a {display: inline-block;}
.fPhone span,small {display: block;}
.fPhone,.fData,.fData p,footer .snsArea,small {text-align: var(--ce);}
footer {padding:2rem 3rem 0;font-size: .75rem;}
footer h2 img {height: 25px;}
footer li a {padding:.5rem 1rem;width: 100%;}
footer li a:is(:hover, :active) {color:var(--Wh);background:var(--og);border-radius: 1rem;}
.fData {font-weight: 500;padding-top:1rem;}
.fData img {height: 30px;}
.fData p {background:var(--Wh);padding:.5rem;border-radius: 1rem;}
.fPhone img {height: 60px;padding:.5rem;}
footer .snsArea {padding:0 .5rem;font-weight: 700;font-size: .7rem;margin:1rem 0;background-image: radial-gradient(circle, var(--Db) 1px, var(--tra) 1px);background-position: right top;background-repeat: repeat-y; background-size: 2px 8px;}
footer .snsArea a {font-size: 1.8rem;padding:0 .8rem;}
small {font-size: .6rem;padding:.5rem 0 0;}
/*** Animate ***/
:root { --animate-duration: 1s; --animate-delay: 1s;}
.animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-duration: var(--animate-duration); animation-duration: var(--animate-duration); -webkit-animation-fill-mode: both; animation-fill-mode: both;}
.animated.infinite { -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite;}
.animated.delay-1s { -webkit-animation-delay: 1s; animation-delay: 1s; -webkit-animation-delay: var(--animate-delay); animation-delay: var(--animate-delay);}
.animated.delay-2s { -webkit-animation-delay: calc(1s * 2); animation-delay: calc(1s * 2); -webkit-animation-delay: calc(var(--animate-delay) * 2); animation-delay: calc(var(--animate-delay) * 2);}
.animated.delay-3s { -webkit-animation-delay: calc(1s * 3); animation-delay: calc(1s * 3); -webkit-animation-delay: calc(var(--animate-delay) * 3); animation-delay: calc(var(--animate-delay) * 3);}
.animated.delay-4s { -webkit-animation-delay: calc(1s * 4); animation-delay: calc(1s * 4); -webkit-animation-delay: calc(var(--animate-delay) * 4); animation-delay: calc(var(--animate-delay) * 4);}
.animated.delay-5s { -webkit-animation-delay: calc(1s * 5); animation-delay: calc(1s * 5); -webkit-animation-delay: calc(var(--animate-delay) * 5); animation-delay: calc(var(--animate-delay) * 5);}
@media print, (prefers-reduced-motion: reduce) {
  .animated { -webkit-animation-duration:   1ms !important; animation-duration:   1ms !important; -webkit-transition-duration:  1ms !important; transition-duration:  1ms !important; -webkit-animation-iteration-count: 1 !important; animation-iteration-count: 1 !important;}
  .animated[class*="Out"] { opacity: 0;}}
@-webkit-keyframes fadeInUp { from { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0);} to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);}}
@keyframes fadeInUp { from { opacity: 0; transform: translate3d(0, 100%, 0);} to { opacity: 1; transform: translate3d(0, 0, 0);}}
.fadeInUp { -webkit-animation-name: fadeInUp; animation-name: fadeInUp;}
@-webkit-keyframes fadeIn { from { opacity: 0; } to { opacity: 1;}}
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1;}}
.fadeIn { -webkit-animation-name: fadeIn; animation-name: fadeIn;}