@charset "utf-8";
/*----------------------------------------------------
  日本語：明朝
  font-family: '游明朝','Yu Mincho',YuMincho,'Hiragino Mincho Pro',serif;

  アイコン
  font-family: "Font Awesome 5 Free";
----------------------------------------------------*/
/* reset */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, em, img, ins, small, strike, strong, sub, sup, tt, var, b, u, i, dl, dt, dd, ol, ul, li, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, figure, figcaption, footer, header, nav, ruby, section, picture {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
  box-sizing: border-box;
}
article, aside, details, figcaption, figure,footer, header, hgroup,nav, section {
  display: block;
}
table {
  border-collapse: collapse;
  font-family: inherit;
}
h1,h2,h3,h4,h5 {
  font-size: 100%;
  line-height:1.3;
}
input,textarea,select {
  font-family: inherit;
  font-size: 16px;
}
input[type="button"],input[type="text"],input[type="submit"] {
   -webkit-appearance: none;
   border-radius: 0;
}
textarea {
  resize: none;
  -webkit-appearance: none;
  border-radius: 0;
}
th,td {
  border-collapse: collapse;
}
table th{
  white-space: nowrap;
}
ul,ol {
  list-style: none;
}
img {
  max-width: 100%;
  vertical-align: bottom;
  height: auto;
}
a{
  text-decoration: none;
  color:#333;
  transition: .5s;
}
a:hover{
  opacity:.8;
}

/* 共通 */
html { 
  font-size:62.5%;
  scroll-behavior: smooth;
}
body{
  -webkit-text-size-adjust: 100%;
  color:#333;
  font-family: '游明朝','Yu Mincho',YuMincho,'Hiragino Mincho Pro',serif;
  font-weight:normal;
  line-height: 1.6;
  font-size:16px;
  overflow-x: hidden;
}

:root{
  /* 濶ｲ */
  --mei:'Segoe UI','メイリオ', 'Meiryo',sans-serif;
}

/*
  ヘッダー 基本幅
------------------------------------------------------------*/
header{
  background: rgba(255,255,255,9);
  height: 60px;
  text-align: center;
  width:100%;
  position: relative;
}
body:not(.p-school) header.fixed{
  position: fixed;
  z-index:2;
  top:0;
  left:0;
}
.p-home header{
  display: none;
}
.p-home header.fixed{
  display: block
}


/*ご予約ボタン*/
#head-res {
  position: absolute;
  left:0;
  top:0;
  z-index: 2;
}
#head-res a{
  background:#aa6f46;
  color:#fff;
  display: block;
  padding:0 1em;
  line-height: 60px;
}
#head-logo01{
  font-size: 32px;
  line-height: 35px;
}
#head-logo02{
  font-size: 14px;
  line-height: 25px;
}
#g-nav{
  position:fixed;
  z-index: 1;
  top:60px;
  right: -100%;
  width:100%;
  height: 100vh;
  background:rgba(255,255,255,.9);
  transition: translate 0.5s;
  font-family: 'Marcellus', serif
}
#g-nav.panelactive{
  right: 0;
}
#g-nav ul {
  position: absolute;
  z-index: 2;
  top:0;
  left:50%;
  transform: translateX(-50%);
  padding:3rem 0 7rem;
}
#g-nav li{
  margin:0 .5rem;
  line-height: 30px;
}
#g-nav li a{
  color: #333;
  text-decoration: none;
  padding:10px .3rem;
  display: block;
  text-align: center;
}

#g-nav #head-sns ul{
  display: flex;
  justify-content: center;
  gap:3rem;
  position: relative;
  transform: none;
  left: auto;
  margin-top: 3rem;
}
#g-nav #head-sns li{
  margin:0 auto;
  line-height: inherit;
}
#g-nav #head-sns a{
  padding:0;
}
#g-nav #head-sns img{
  width:3rem;
}
#g-nav #head-sns .name{
  display: block;
  font-family: var(--mei);
  font-size: 1.175rem;
  line-height: 1.6;
}
#g-nav #head-sns img{
  width: 3rem;
  height: auto;
  vertical-align: middle;
}

.openbtn1{
  z-index: 9999;
  top:5px;
  right: 10px;
  cursor: pointer;
  width: 50px;
  height:50px;
  color:#333;
  position: absolute;
}
.openbtn1 span{
  display: inline-block;
  transition: all .2s;
  position: absolute;
  left: 14px;
  height: 3px;
  border-radius: 2px;
  background-color: #333;
  width: 45%;
}
.openbtn1 span:nth-of-type(1) {
  top:15px; 
}
.openbtn1 span:nth-of-type(2) {
  top:23px;
}
.openbtn1 span:nth-of-type(3) {
  top:31px;
}
.openbtn1.active span:nth-of-type(1) {
  top: 18px;
  left: 18px;
  transform: translateY(6px) rotate(-45deg);
  width: 30%;
}
.openbtn1.active span:nth-of-type(2) {
  opacity: 0;
}
.openbtn1.active span:nth-of-type(3){
  top: 30px;
  left: 18px;
  transform: translateY(-6px) rotate(45deg);
  width: 30%;
}

/*ナビゲーションの縦スクロール*/
#g-nav.panelactive #g-nav-list{
    /*ナビの数が増えた場合縦スクロール*/
    position: fixed;
    z-index: 999; 
    width: 100%;
    height: 100vh;/*表示する高さ*/
    overflow: auto;
    -webkit-overflow-scrolling: touch;
}

/*
  フッター 基本幅
------------------------------------------------------------*/
footer{
  background: #333;
  color:#fff;
  text-align: center;
}
footer .footer-inner{
  width:90%;
  margin:auto;
  max-width: 1200px;
  padding:6rem 0 3rem;
}
footer a{
  color:#fff;
}
footer #foot-logo01{
  font-size:12rem;
  padding-left: 2rem;
}
footer #foot-logo02{
  font-size:2rem;
  display: block
}
footer #foot-add{
  margin-top:8rem;
}
footer #foot-map{
  display: inline-block;
  margin-top: 1rem;
}
footer #foot-tel-res ul{
  width: 90%;
  margin: 1em auto;
}
footer #foot-tel-res li{
  width: 100%;
  max-width: 250px;
}
footer #foot-tel-res #foot-tel{
  max-width: 250px;
}
footer #foot-tel-res #foot-res{
  display: flex;
  flex-wrap: wrap;
  gap:1.5em;
  justify-content: center;
}

footer .btn02{
  margin:2.5rem auto;
  font-size:1.75rem;
  letter-spacing: .05em;
  text-indent: .05em;
  padding:.5em;
}
footer #foot-nav li{
  display: inline-block;
  padding:.25em .75em;
}
footer #foot-sns{
  display: flex;
  justify-content: center;
  gap:3rem;
  margin-top: 4rem;
}
footer #foot-sns img{
  width:3rem;
}
footer #foot-sns .name{
  display: block;
  font-family: var(--mei);
  font-size: 1.175rem;
  line-height: 1.6;
}
footer #copy{
  line-height: 30px;
  color:#ccc;
  font-size:14px;
}
/*pagetop*/
#pagetop a{
  display: flex;
  justify-content:center;
  align-items:center;
  background:rgba(0,0,0,.5);
  width: 4rem;
  height: 4rem;
  color: #fff;
  text-align: center;
  text-transform: uppercase; 
  text-decoration: none;
  font-size:1.8rem;
  transition:all 0.3s;
  border-radius: 2px;
  border: 1px solid rgba(0,0,0,.1);
}
#pagetop a:hover{
  background:rgba(0,0,0,1);
  opacity: 1;
  transform: translateY(-5px);
}
/*リンクを右下に固定*/
#pagetop {
  position: fixed;
  right: 1rem;
  bottom:1rem;
  z-index: 1;
  opacity: 0;
  transform: translateY(100px);
}

#pagetop.UpMove{
  animation: UpAnime 0.5s forwards;
}
@keyframes UpAnime{
  from {
    opacity: 0;
  transform: translateY(100px);
  }
  to {
    opacity: 1;
  transform: translateY(0);
  }
}
#pagetop.DownMove{
  animation: DownAnime 0.5s forwards;
}
@keyframes DownAnime{
  from {
    opacity: 1;
  transform: translateY(0);
  }
  to {
    opacity: 1;
  transform: translateY(100px);
  }
}

/*
  ロゴフォント　基本幅
------------------------------------------------------------*/
[class*="logo"],[id*="logo"]{
  font-family: 'Italiana', serif;
  text-align: center;
  line-height: 1.4;
  letter-spacing: .05rem;
  text-indent: .05rem;
}

/*
  タイトル　基本幅
------------------------------------------------------------*/
.eng-ttl{
  font-family: 'Marcellus', serif!important;
  letter-spacing: .05em;
}
.p-sub #page-ttlBox{
  background: #333;
  color:#fff;
  padding-bottom: 1rem;
  text-align: center;
  line-height: 1.3;
}
.p-sub #page-ttlBox .eng-ttl{
  /*font-size:4rem;*/
  font-size:2.6rem;
  padding:1.75rem .5% .75rem;
  text-transform: uppercase;
  text-indent: .1em;
  letter-spacing: .1em;
}

/*
  パンくず　基本幅
------------------------------------------------------------*/
#bread {
  padding: 0 0.5em;
  color:"#fff";
  font-family:'Segoe UI','メイリオ', 'Meiryo',sans-serif;
  text-align: left;
}
#bread li {
  display: inline;
  font-size: 12px;
  padding-right: 0.25em;
}
#bread li a{
  color:#fff;
}
#bread li a:after {
  font-family: "Font Awesome 5 Free";
  content: "\f105";
  margin-left: 0.5em;
  font-weight: bold;
}


/*
  リンクボタン　基本幅
------------------------------------------------------------*/
[class^="btn0"] {
  display: block;
  text-align: center;
  line-height: 1.3;
  padding: .75em 1.5rem;
  font-family:'メイリオ', 'Meiryo',sans-serif;
  border-radius: 2px;
  font-size: 1.4rem;
}

.btn01 {
  border: 1px solid #333;
  background: none;
}
.btn02 {
  background: #fff;
  border: 1px solid #333;
  color: #333;
}
.btn03 {
  color: #fff;
  background: #333;
  border: 1px solid #fff;
}
.btn06 {
  color: #fff;
  background: #333;
}
.btn07 {
  border: 1px solid #fff;
  background: none;
  color:#fff;
}
.btn08{
  background:#aa6f46;
  color:#fff;
  border:1px solid #aa6f46;
}

[class^="btn0"] i{
  font-size:.8em;
  margin-right: .5em;
}
.gaibu{
  position: relative
}
.gaibu::after{
 font-family: "Font Awesome 5 Free";
  font-weight: bold;
  content: "\f35d";
  position: absolute;
  top: 50%;
  right: 0.55em;
  transform: translateY(-50%);
  font-size:.8em;
}

/*
  他 基本幅
------------------------------------------------------------*/
/*reCAPTCHAバッジ*/
.grecaptcha-badge { visibility: hidden; }

/* リスト */
.list-dotted li{
  line-height:1.5;
  margin:.5em 0;
  display: flex;
}
.list-dotted li::before{
  content:"・";
}


/* 吹き出し */
.balloon01{
  position: relative;
  padding:0;
  width: 3em;
  height: 3em;
  line-height: 3em;
  border-radius: 50%;
  text-align: center;
  color: #ffffff;
  font-size: .8em;
  background-color: #aa6f46;
  display: block
}
.balloon01::before{
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  left: -.8rem;
  bottom: 1rem;
  border-right: 1.3rem solid #aa6f46;
  border-top: .5rem solid transparent;
  border-bottom: .4rem solid transparent;
  transform: rotate(-10deg);
  z-index: -1;
}




/* フォント */
.font1-2rem{font-size:1.2rem}
.font1-3rem{font-size:1.3rem}
.font1-4rem{font-size:1.4rem}
.font1-5rem{font-size:1.5rem}
.font1-6rem{font-size:1.6rem}
.font2rem{font-size:2rem}
.font2-5rem{font-size:2.5rem}
.font3rem{font-size:3rem}
.font4rem{font-size:4rem}
.mei{
  font-family:'Segoe UI','メイリオ', 'Meiryo',sans-serif;
  font-weight: normal;
}
.min{
 font-family: '游明朝','Yu Mincho',YuMincho,'Hiragino Mincho Pro',serif!important;
}
.lato{font-family: 'Lato','Noto Sans JP',sans-serif;}
.bold{font-weight: bold}

/* マーカー */
.marker01 {
    background: linear-gradient(transparent 85%, #aa6f46 85%);
}

/* 前景 */
.red{color:#c66}
.brown{color: #aa6f46}

/* 背景 */
.bg-white{background: #fff}
.bg-gray{background: #eee}
/* 文字種 */
.upper{text-transform: uppercase}

/* 文字飾り */
.under{text-decoration: underline}

/* 表示/非表示 */
.sr-only,.sp-none,.pc-only{display:none}

/*ページリンク*/
.anchor{
  scroll-margin-top: 65px; 
}

/* 回り込み */
.cf::after{
  display: block;
  clear: both;
  content:"";
}
.nowrap{white-space: nowrap}

/* 配置 */
.center{text-align: center}
/* 幅 */
.w45per{width: 45%;margin:auto}
.w50per{width: 50%;margin:auto}
.w90per{width: 90%;margin:auto}
.w100per{width: 100%;margin:auto}
.max200{max-width: 200px}
.max300{max-width: 300px}
.max450{max-width: 450px}
.max500{max-width: 500px}
.max600{max-width: 600px}
.max700{max-width: 700px}
.max900{max-width: 900px}
.max1000{max-width: 1000px}
.max1180{max-width: 1180px}
.max1200{max-width: 1200px}


/* 余白 */
.mt-5rem{margin-top:.5rem}
.mt1rem{margin-top:1rem}
.mt2rem{margin-top:2rem}
.mt3rem{margin-top:3rem}
.mt4rem{margin-top:4rem}
.mt5rem{margin-top:5rem}
.mt6rem{margin-top:6rem}
.mt7rem{margin-top:7rem}
.mb1em{margin-bottom: 1em!important}
.mb2rem{margin-bottom: 2rem}
.mb6rem{margin-bottom: 6rem}

.mt1em{margin-top:1em!important}
.mr0{margin-right: 0!important}
.ml1em{margin-left:1em}
.pt3rem{padding-top:3rem}
.pb6rem{padding-bottom:6rem}



/* ----------------------------------------------------
 出現時の動き　基本幅
------------------------------------------------------*/
/*==================================================
ふわっ
===================================*/

/* その場で */
.fadeIn{
animation-name:fadeInAnime;
animation-delay: 0.25s;
animation-duration:1.5s;
animation-fill-mode:forwards;
opacity:0;
}

@keyframes fadeInAnime{
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

/* 下から */
.fadeUp{
animation-name:fadeUpAnime;
animation-duration:.75s;
animation-fill-mode:forwards;
opacity:0;
}
@keyframes fadeUpAnime{
  from {
    opacity: 0;
  transform: translateY(2.5rem);
  }
  to {
    opacity: 1;
  transform: translateY(0);
  }
}

/* 上から */

.fadeDown{
animation-name:fadeDownAnime;
animation-duration:.75s;
animation-fill-mode:forwards;
opacity:0;
}

@keyframes fadeDownAnime{
  from {
  opacity: 0;
  transform: translateY(-2.5rem);
  }

  to {
    opacity: 1;
  transform: translateY(0);
  }
}

/* 左から */

.fadeLeft{
animation-name:fadeLeftAnime;
animation-duration:.75s;
animation-fill-mode:forwards;
opacity:0;
}

@keyframes fadeLeftAnime{
  from {
    opacity: 0;
  transform: translateX(-2rem);
  }

  to {
    opacity: 1;
  transform: translateX(0);
  }
}

/* 右から */

.fadeRight{
animation-name:fadeRightAnime;
animation-duration:.75s;
animation-fill-mode:forwards;
opacity:0;
}

@keyframes fadeRightAnime{
  from {
    opacity: 0;
  transform: translateX(2rem);
  }

  to {
    opacity: 1;
  transform: translateX(0);
  }
}

/* スクロールをしたら出現する要素にはじめに透過0を指定　*/
 
.fadeInTrigger,
.fadeUpTrigger,
.fadeDownTrigger,
.fadeLeftTrigger,
.fadeRightTrigger{
    opacity: 0;
}


/*==================================================
くるっ
===================================*/


/* X 軸（縦へ） */
.rotateX{
  animation-name:rotateXAnime;
  animation-duration:1s;
  animation-fill-mode:forwards;
}

@keyframes rotateXAnime{
  from{
    transform: rotateX(0);
    opacity: 0;
    }
  to{
    transform: rotateX(-360deg);
    opacity: 1;
    }
}

/*　Y軸（横へ） */
.rotateY{
  animation-name:rotateYAnime;
  animation-duration:1s;
  animation-fill-mode:forwards;
}

@keyframes rotateYAnime{
  from{
    transform: rotateY(0);
    opacity: 0;
    }
  to{
    transform: rotateY(-360deg);
    opacity: 1;
    }
}

/* Z 軸（左へ） */
.rotateLeftZ{
  animation-name:rotateLeftZAnime;
  animation-duration:1s;
  animation-fill-mode:forwards;
}

@keyframes rotateLeftZAnime{
  from{
    transform: rotateZ(0);
    opacity: 0;
    }
  to{
    transform: rotateZ(-360deg);
    opacity: 1;
    }
}

/*　Z 軸（右へ） */
.rotateRightZ{
  animation-name:rotateRightZAnime;
  animation-duration:1s;
  animation-fill-mode:forwards;
}

@keyframes rotateRightZAnime{
  from{
    transform: rotateZ(0);
    opacity: 0;
    }
  to{
    transform: rotateZ(360deg);
    opacity: 1;
    }
}

/* スクロールをしたら出現する要素にはじめに透過0を指定　*/
 
.rotateXTrigger,
.rotateYTrigger,
.rotateLeftZTrigger,
.rotateRightZTrigger{
    opacity: 0;
}

/*==================================================
ボンッ、ヒュッ
===================================*/

/* 拡大 */
.zoomIn{
  animation-name:zoomInAnime;
  animation-duration:0.5s;
  animation-fill-mode:forwards;
}

@keyframes zoomInAnime{
  from {
  transform: scale(0.6);
  opacity: 0;
  }

  to {
    transform: scale(1);
  opacity: 1;
  }
}

/* 縮小 */
.zoomOut{
  animation-name:zoomOutAnime;
  animation-duration:0.5s;
  animation-fill-mode:forwards;
}

@keyframes zoomOutAnime{
  from {
  transform: scale(1.2);
  opacity: 0;
  }

  to {
    transform:scale(1);
  opacity: 1;
  }
}

/* スクロールをしたら出現する要素にはじめに透過0を指定　*/
 
.zoomInTrigger,
.zoomOutTrigger{
    opacity: 0;
}


/*==================================================
スーッ（枠線が伸びて出現）
===================================*/

/*枠線が伸びて出現*/

.lineTrigger{
  position: relative; /* 枠線が書かれる基点*/
  opacity:0;
}

.lineTrigger.lineanime{
  animation-name:lineAnimeBase;
  animation-duration:1s;
  animation-fill-mode:forwards;
}

@keyframes lineAnimeBase{
  from {
    opacity:0;
  }

  to {
    opacity:1;  
}
}

/*上下線*/
.lineTrigger::before,
.lineTrigger::after{
  position: absolute;
  content:"";
  width:0;
  height:1px;
  background:#333;/* 枠線の色*/
}

/*左右線*/
.line2::before,
.line2::after{
  position: absolute;
  content:"";
  width: 1px;
  height:0;
  background:#333;/* 枠線の色*/
}

/*上線*/
.lineTrigger::before {
  top:0;
  left:0;
}

.lineTrigger.lineanime::before {
  animation: lineAnime .5s linear 0s forwards;/*表示されて0秒後に上線が0.5秒かけて表示*/
}

/*右線*/
.line2::before{ 
  top:0;
  right:0;
}

.lineTrigger.lineanime .line2::before {
  animation: lineAnime2 .5s linear .5s forwards;/*表示されて0.5秒後に右線が0.5秒かけて表示*/
}

/*下線*/
.lineTrigger::after { 
  bottom:0;
  right:0;
}

.lineTrigger.lineanime::after {
  animation: lineAnime .5s linear 1s forwards;/*表示されて1秒後に下線が0.5秒かけて表示*/
}

/*左線*/
.line2::after{ 
  bottom:0;
  left:0;
}

.lineTrigger.lineanime .line2::after {
  animation: lineAnime2 .5s linear 1.5s forwards;/*表示されて1.5秒後に左線が0.5秒かけて表示*/
}

@keyframes lineAnime {
  0% {width:0%;}
    100%{width:100%;}
}

@keyframes lineAnime2 {
  0% {height:0%;}
    100%{height:100%;}
}

/*枠線内側の要素*/

.lineTrigger.lineanime .lineinappear{
  animation: lineInnerAnime .5s linear 1.5s forwards;/*1.5秒後に中央のエリアが0.5秒かけて表示*/
  opacity: 0;/*初期値を透過0にする*/ 
}

@keyframes lineInnerAnime{
  0% {opacity:0;}
    100% {opacity:1;}
}





/*==================================================
アニメーション設定
===================================*/

/* アニメーションの回数を決めるCSS*/

.count2{  
  animation-iteration-count: 2;/*この数字を必要回数分に変更*/
}

.countinfinite{  
  animation-iteration-count: infinite;/*無限ループ*/
}

/* アニメーションスタートの遅延時間を決めるCSS*/
.delay-time025{  
  animation-delay: 0.25s;
}
.delay-time05{  
  animation-delay: 0.5s;
}
.delay-time075{  
  animation-delay: 0.75s;
}
.delay-time1{  
  animation-delay: 1s;
}
.delay-time125{  
  animation-delay: 1.25s;
}
.delay-time15{
  animation-delay: 1.5s;
}
.delay-time175{
  animation-delay: 1.75s;
}
.delay-time2{
  animation-delay: 2s;
}
.delay-time225{
  animation-delay: 2.25s;
}
.delay-time25{  
  animation-delay: 2.5s;
}

/* アニメーション自体が変化する時間を決めるCSS*/

.change-time05{  
  animation-duration: 0.5s;
}

.change-time1{  
  animation-duration: 1s;
}

.change-time15{  
  animation-duration: 1.5s;
}

.change-time2{  
  animation-duration: 2s;
}

.change-time25{  
  animation-duration: 2.5s;
}





/* -------------------------------------------------------- */
/*　　　　　　　　　　　　　　　　　　　　　　　　　　　　           */
/*      520px幅以上（スマホ横・タブレット）  　　　              */  
/* 　　　　　　　　　　　　　　　　　　　　　　　　　　　          　*/
/* -------------------------------------------------------- */

@media only screen and (min-width: 520px) {
html { font-size: 61%}
}

/* -------------------------------------------------------- */
/*　　　　　　　　　　　　　　　　　　　　　　　　　　　　           */
/*      768px幅以上（タブレット） 　　　        　              */  
/* 　　　　　　　　　　　　　　　　　　　　　　　　　　　           */
/* -------------------------------------------------------- */

@media only screen and (min-width: 768px) {
html { font-size: 65%}
  
/* 表示 / 非表示 */
.sp-only{display: none}
  
}

/* -------------------------------------------------------- */
/*　　　　　　　　　　　　　　　　　　　　　　　　　　　　           */
/*     960px幅以上　　        　                      */  
/* 　　　　　　　　　　　　　　　　　　　　　　　　　　　           */
/* -------------------------------------------------------- */
@media only screen and (min-width: 960px) {
html { font-size: 68.8%}

 /*
  ホーム 960px幅以上
------------------------------------------------------------*/ 
  
/*
  フッター 960px幅以上
------------------------------------------------------------*/
  
[class^="btn0"]{
  position: relative;
  transform: scale(1, 1);
  transition: transform .5s;
}
.btn01:hover{
  color: #fff;
}
.btn03:hover,
.btn06:hover,
.btn07:hover{
  color: #333;
}
.btn08:hover{
  color:#aa6f46;
}

[class^="btn0"]::before{
  position: absolute;
  top: -1px;
  right: -1px;
  bottom: -1px;
  left: -1px;
  content: '';
  transform-origin: center center;
  transform: scale(0, 1);
  transition: transform .5s;
  z-index: -1;
}
.btn01::before{
  background: #333;
}
.btn02::before{
  background: #eee;
}
.btn03::before,
.btn06::before{
  background: #fff;
  border: 1px solid #333;
}

.btn07::before{
  background: #fff;
}
.btn05::before{
  background: #666;
}
.btn08::before{
  background:#fff;
  border: 1px solid #aa6f46;
}

[class^="btn0"]:hover::before {
  transform: scale(1,1); 
  transition: transform .5s;
}
[class^="btn0"]:hover{
  text-decoration: none;
  opacity: 1;
}
  
/* Telリンク無効 */  
a[href^="tel:"] {
  pointer-events: none;
}

.pc-center{text-align: center}

/* 表示・非表示 */
.pc-none{display: none}
.pc-only{display: block}
br.pc-only{display: inline-block}
}

/* ----------------------------------------------- */
/*　　　　　　　　　　　　　　　　　　　　　　　　　　　　  */
/*      1280px幅以上（PC）　　        　             */  
/* 　　　　　　　　　　　　　　　　　　　　　　　　　　　　 */
/* ----------------------------------------------- */
  
@media only screen and (min-width: 1280px) {
html { font-size: 70%}
.openbtn1{
  display: none
}
  
#head-logo01{
  font-size:40px;
  line-height: 50px;
  display: inline-block;
}
#g-nav{
  height: 60px;
  top:0;
  background: none;
  right: 90px;
  z-index: 0
}
body.p-school #g-nav{
  position:absolute;
}  

#g-nav.panelactive{
  right: 100px;
}
#g-nav ul{
  transform:none;
  display: flex;
  left: inherit;
  right: 0;
  top:0;
  padding:0;
}
#g-nav li{
  margin:15px .5rem;
}
#g-nav li:not(.head-sns) a{
  color: #333;
  text-decoration: none;
  padding:0 .65rem;
  display: block;
  text-align: center;
  position: relative;
}
#g-nav li:not(.head-sns) a::before {
  position: absolute;
  bottom: 1px;
  left: 4%;
  content: '';
  width: 92%;
  height: 2px;
  background: #aa6f46;
  transform: scale(0, 1);
  transform-origin: center top;
  transition: transform .5s;
  border-radius: 2px;
}
#g-nav li a:hover::before {
  transform: scale(1, 1);
}
#head-res{
  right:0;
  left: auto;
}
#head-logo02{
  font-size:20px;
  position: absolute;
  left:1%;
  top:50%;
  transform: translateY(-50%);
  z-index: 1
}

#g-nav #head-sns{
  display: none;
}



/*
  タイトル　1280px以上
------------------------------------------------------------*/
.p-sub #page-ttlBox .eng-ttl{
  padding:1rem .5%;
}

/*
  フッター　1280px以上
------------------------------------------------------------*/  

  
/*pagetop*/
#pagetop a{
  width: 5rem;
  height: 5rem;
}


}



/* -------------------------------------------------------- */
/*　　　　　　　　　　　　　　　　　　　　　　　　　　　         　  */
/*      1920px幅以上    　　　        　                      */  
/* 　　　　　　　　　　　　　　　　　　　　　　　　　         　　　 */
/* -------------------------------------------------------- */
@media only screen and (min-width: 1920px) {
  html { font-size: 75%}
}

/* -------------------------------------------------------- */
/*　　　　　　　　　　　　　　　　　　　　　　　　　　　          　　*/
/*      2560px幅以上    　　　        　                   　  */  
/* 　　　　　　　　　　　　　　　　　　　　　　　　　          　　  */
/* -------------------------------------------------------- */
@media only screen and (min-width: 2560px) {
html { font-size: 80%}
  
}

/* -------------------------------------------------------- */
/*　　　　　　　　　　　　　　　　　　　　　　　　　　　　           */
/*      IE 　　　        　                              */  
/* 　　　　　　　　　　　　　　　　　　　　　　　　　　　           */
/* ------------------------------------------------------- */
@media all and (-ms-high-contrast: none) {
  [class^="btn0"].min{
    padding: 1em 1.5rem .5em;
  }
  #head-res.min a{
    padding-top:5px;
    margin-bottom:-5px;
    line-height: 55px;
  }

}



/* -------------------------------------------------------- */
/*　　　　　　　　　　　　　　　　　　　　　　　　　　　　           */
/*      print  　　　        　                              */  
/* 　　　　　　　　　　　　　　　　　　　　　　　　　　　           */
/* ------------------------------------------------------- */
@media print{
  
.fadeInTrigger,
.fadeUpTrigger,
.fadeDownTrigger,
.fadeLeftTrigger,
.fadeRightTrigger,
.rotateXTrigger,
.rotateYTrigger,
.rotateLeftZTrigger,
.rotateRightZTrigger{
    opacity: 1;
}
  
  
}