/*
Theme Name : 山口大学大学院･医学系研究科 神経解剖学
*/
@charset "utf-8";
/* CSS Document */

@font-face{
	font-family: 'Noto Sans JP';
	font-style:normal;
	font-weight: 400;
	src:
	local("Noto Sans CJK JP"),	url(//fonts.gstatic.com/ea/notosansjp/v5/NotoSansJP-Regular.woff2) format('woff2'),
		url(//fonts.gstatic.com/ea/notosansjp/v5/NotoSansJP-Regular.woff) format('woff'),
		url(//fonts.gstatic.com/ea/notosansjp/v5/NotoSansJP-Regular.otf) format('opentype');
	
}

html{
	font-size:87.5% !important;/*16px×62.5％＝10px*/
    
}
body{
	color: #000;
    font-family: "Helvetica Neue",
    Arial,
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    Meiryo,
    sans-serif;
/*    font-family:'Montserrat', "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;*/
	font-size: 1.4rem;
	font-feature-settings: "palt";
	letter-spacing: 0.055em;
    text-align: justify;
    text-justify: inter-ideograph;
    overflow-x: hidden;
    
}
body.is-modal-open {
    overflow: hidden;
}

.inner{
    overflow: hidden;
}
p{
    color: #000;
    line-height: 1.6;
    letter-spacing: 0.08em;
}
a{
    color: #fff;
    transition: 0.3s;
        font-weight: bold;
}
a:hover{
    opacity: 0.8;
}
.d-none{
    display: none;
}
hr {
  height: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.left{
    text-align: left;
}
.flex{
    display: flex;
    gap:15px;
    margin-top: 10px;
}
.button1_wrap{
    text-align: center;
}
.button1 {
    background: #0094c8;
    padding: 10px 50px;
    color: #fff;
    font-size: 14px;
    display: inline-block;
    margin-top: 40px;
}
.button2{
    background: #fff;
    border-radius: 50px;
    padding: 10px 20px;
    color: #00404e;
    float: right;
}
.button3{
    background: #00404e;
    border-radius: 50px;
    padding: 10px 20px;
    color: #fff;
    float: right;
    margin-left: 10px;
}

.widget--sticky {
  position: sticky;
  top: 100px; /* スクロール時にビューポートの20px位置に達すると固定 */
}


/*スマホでは消す*/
.pc-dN{
	display:none!important;
}
.tb-dN{
	display:none!important;
}
.btn-trigger{
	display:none!important;
}
/*書体明朝に*/
.font-min{
    font-family:'游明朝体', '游明朝', YuMincho, 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', 'ＭＳ Ｐ明朝', 'MS PMincho', serif;
}

/*アンカーリンク位置調整*/
.anchorlink {height: 1px;
display: block;
padding-top: 90px;
margin-top: -90px;
}

hr.style45{
	border-top: 1px solid #00404e;
    margin: 20px 0;
    transform: rotate(-45deg);
    width: 300px;
}
hr.style20{
	border-top: 1px solid #00404e;
    margin: 20px 0;
}
hr.style10{
	border-top: 1px solid #00404e;
    margin: 10px 0;
}
hr.style30{
	border-top: 1px dotted #fff;
    margin: 30px 0;
}

p.indent {
    text-indent: -0.7em;
    padding-left: 1em;
}
.spacer40{
    margin-top: 40px;
}

@media only screen and ( max-width : 768px ) {
    hr.style45{
            margin-bottom: -10px;
    margin-left: -150px;
    }
}

/* ---------------------------------------------------------------------------------------------
　   HEADER
--------------------------------------------------------------------------------------------- */
h1{
    text-align: center;
}
h1 a{
    font-family: "Noto Serif JP", serif;
    font-size: 20px;
    font-weight: 400;
    color: #fff;
    line-height: 1.2;
    align-items: center;
    display: flex;
    gap: 5px;
}
h1 span {
  font-size: 15px;
}

.h4hed {
    font-size: 18px;
    font-weight: 500;
}
.h5hed {
    color: #0094c8;
    font-size: 16px;
    font-weight: 500;
        margin-top: 30px;
        margin-bottom: 10px;
}

#header {
  z-index: 3;
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  height: 80px;
  border-bottom: solid 1px #fff;
  display: flex;
  align-items: center;
  padding-left: 50px;
  box-sizing: border-box;
  transition: background .5s;
  transform: translateY(-100%);
  opacity: 0;

  /* アニメーションを適用 */
  animation: slideInHeader 1s ease forwards;
}

@keyframes slideInHeader {
  to {
    transform: translateX(0); /* 元の位置に戻す */
    opacity: 1;              /* フェードイン */
  }
}

.fix_menu{
/*    background: rgba(209, 235, 245, 0.7);*/
}
.fixedmenu{
    background: rgba(0 , 64 , 78 , 0.9);
  }
#header .container{
/*    margin-top: 15px;*/
}


.nav-pc li{
    flex-grow: 1;
    text-align: center;
    padding: 0 8px;
    font-weight: 700;
        line-height: 1.3;
}
.nav-pc li span{
    font-size: 12px;
    font-weight: 400;
    color: #deb464;
    display: block;
}





  .nav-pc {
    position: relative;
    display: flex;
  align-items: center;
  }




.headtel{
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    font-size: 20px;
    text-align: center;
    margin-right: 10px;
    color: #008181;
}
.headtel a{
    color: #008181;
}
.headtel span{
    font-size: 12px;
    color: #000;
}
@media only screen and ( max-width : 1100px ) {
    
        /*タブレットで表示*/
            .tb-dN{
            display:block!important;
        }
    
    
}
@media only screen and ( max-width : 1236px ) {

    .nav-pc li{
            padding: 0 10px;
    }
    .headtel span{
            font-size: 9px;
    }
    
    .nav-pc li a {
            font-size: min(1.1vw, 13px);
}
    h1 span{
            font-size: 1vw;
    }
    .nav-pc li span{
        font-size: clamp(10px, 1.2vw, 13px);
            margin-left: 5px;
    }
    .scroll-infinity__item {
    width: calc(100vw / 4);
}
    
}
@media only screen and ( max-width :1129px ) {
    h1 a{
        font-size: 1.6vw;

    }
    
}
  @media only screen and ( max-width : 768px ) {
      /*スマホでは消す*/
    .sp-dN{
	display:none;
}
          .pc-dN{
        display:block!important;
    }
      h1 span{
              font-size: 11px;
              margin-left: 7px
      }
      h1 a{
        font-size:min(4.5vw,13px);

    }
      
      
      
}



#h_top{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0px 50px 0px 50px;
     position: absolute; 
    top: 23px;
    right: 0;
}


@media only screen and ( max-width : 768px ) {
    #header .container {
     margin-top: 0px; 
}
  #header {
    padding: 10px 0 10px 20px;
    height: 51px;
  }
    #h_top{
    margin: 0px 20px;
}   

    
}


/* ---------------------------------------------------------------------------------------------
　   ハンバーガーメニュー
--------------------------------------------------------------------------------------------- */

.btn-gNav {
    position: fixed;
    top: 13px;
    right: 20px;
    width: 30px;
    height: 24px;
    z-index: 12;
    box-sizing: border-box;
    cursor: pointer;
    -webkit-transition: all 400ms;
    transition: all 400ms;
    
}

.btn-gNav span {
    position: absolute;
    width: 100%;
    height: 4px;
    background: #fff;
    border-radius: 10px;
    -webkit-transition: all 400ms;
    transition: all 400ms;
}
.btn-gNav span:nth-child(4) {
    position: absolute;
    width: 100px;
    height: inherit;
    background: inherit;
    border-radius: inherit;
    -webkit-transition: all 400ms;
    transition: all 400ms;
    font-size: 10px;
    bottom: -23px;
    right: -65px;
    font-weight: bold;
    color: #fff;
}

.btn-gNav span:nth-child(1) {
    top: 0;
}

.btn-gNav span:nth-child(2) {
    top: 10px;
}

.btn-gNav span:nth-child(3) {
    top: 20px;
}

.btn-gNav.open span:nth-child(1) {
    background: #fff;
    top: 6px;
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

.btn-gNav.open span:nth-child(2),
.btn-gNav.open span:nth-child(3) {
    top: 6px;
    background: #fff;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    transform: rotate(45deg);
}




.btn-gNav {
    display: none;
}

@media screen and (max-width: 768px) {
    .btn-gNav {
        display: block;
    }

    .gNav {
        position: fixed;
        top: 0;
        right: -100%;
        width: 100%;
        height: 100vh;
        background: rgba(0 , 64 , 78, 0.9);
        font-size: 16px;
        box-sizing: border-box;
        z-index: 5;
        padding-top: 63px;
        transition: .3s;
        margin-top: 0px;
    }

    .gNav.open {
        right: 0;
    }

    .gNav .gNav-menu {
        flex-direction: column;
    }

    .gNav .gNav-menu li {
        width: 86%;
        padding: 15px;
        border-bottom: #fff 1px solid;
    }
    .gNav .gNav-menu li a{
        display: flex;
        align-items: center;
        color: #fff;
        justify-content: flex-start;
        text-align: left;
        line-height: 1.4;
    }
    .gNav .gNav-menu li .yajirushi{
        color: #fff;
        margin-left: 10px;
    }
    .nav-pc li a{
        font-size: 14px;
    }


}
    

/* ---------------------------------------------------------------------------------------------
　   固定ページ
--------------------------------------------------------------------------------------------- */
.pages{
    background-color: #00404e;
    padding: 100px 0 10px;
    position: relative;
}

.contents{
    max-width: 980px;
    width: 100%;
    margin: 0 auto;
    padding: 40px 50px 0;
    box-sizing: border-box;
    position: relative;
        z-index: 1;
}

.sentence p{
    margin: 10px 0 30px 0;
}
.sentence img{
    display: block;
    width: 100%;
    max-width: 800px;
    margin: 0 auto 50px;
}
@media only screen and ( max-width : 768px ) {
    .contents{
        padding: 0 20px;
        position: relative;
    }
    .sentence{
        margin-top: 40px;
}
    
}

.line01 {
    position: absolute;
    top: 400px;
    width: 100%;
    mix-blend-mode: multiply;
    clip-path: inset(100% 0 0 0);
    animation: revealUp 2s ease forwards;
    opacity: 0.5;
}
.line01_2 {
    position: absolute;
    width: 100%;
    mix-blend-mode: multiply;
    clip-path: inset(100% 0 0 0);
    animation: revealUp 2s ease forwards;
    opacity: 0.5;
    top: 0px;
    transform: scale(-1, -1);
}
.line01_3 {
    bottom: 0px;
    top: inherit;
}

@keyframes revealUp {
    to {
        clip-path: inset(0 0 0 0);
    }
}

/*年丸*/
.year{
    display: grid;
    grid-template-columns: repeat(auto-fit, 18%);
    justify-content: center;
    grid-gap: 1rem;
    margin: 20px auto 50px;
    z-index: 1;
    position: relative;
}
.year a{
        margin: auto;
}



.circle{
    width:100px;
    height:100px;
    border-radius:50%;
    border: 1px solid #00404e;
    background:#00404e;
    font-size: 20px;
    position: relative;
    
}
.circlep{
    text-align:center;
    line-height:68px;
    color: #fff;
}
.circleparrow{
    text-align:center;
    display: block;
    margin-top: -51px;
}
.circle2{
    width:100px;
    height:100px;
    border-radius:50%;
    border:1px solid #00404e;
    background:#fff;
    font-size: 20px;
    position: relative;
    
}
.circlep2{
    text-align:center;
    line-height:68px;
    color: #00404e;
}
.publication-item p{
    border-bottom: #002e3a 1px solid;
    padding: 10px 0 20px;
    margin: 10px 0 10px 0;
}
.publication-item p:last-of-type{
    border-bottom: #002e3a 0px solid;
}
@media only screen and ( max-width : 768px ) {
    .year{
        
    }
    .circle,.circle2{
        width:60px;
        height:60px;
        font-size: 15px;
    }
    .circlep{
        line-height: 32px;
    }
    .circleparrow{
            margin-top: -37px;
    }
    .circlep2{
        line-height: 32px;
    }
    .line01_sp_top{
        position: absolute;
        width: 100%;
        mix-blend-mode: multiply;
        clip-path: inset(100% 0 0 0);
        animation: revealUp 2s ease forwards;
        opacity: 0.5;
        top: inherit;
        bottom: 0;
    }
    .line01_3{
        top: -200px;
    }
    .line02{
        z-index: 0;
        top: -120px;
    }

}

/* ---------------------------------------------------------------------------------------------
　   トップ
--------------------------------------------------------------------------------------------- */

/*パーティクル*/
#particles-js{
  position: relative;
  pointer-events: none;
  width: 100%;
  height: 100vh;
    max-height: 800px;
  margin: auto;
  background-color: #00404e; 
}





.line02 {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 36vw;
  max-width: 400px;
  min-width: 300px;
  z-index: -1;
  clip-path: inset(0 0 100% 0);
  /* animation指定は外す */
}
/* アニメーションはanimateクラス付与時のみ */
.line02.animate {
  animation: revealDown2 2s ease forwards;
}
@keyframes revealDown2 {
  to { clip-path: inset(0 0 0 0); }
}



.line05 {
    position: absolute;
    top: 0;
    left: -20%;
    width: 100%;
    clip-path: inset(100% 0 0 0);
}
.line05.animate {
  animation: revealUp 2s ease forwards;
}
@keyframes revealUp {
    to {
        clip-path: inset(0 0 0 0);
    }
}

.line06 {
    position: absolute;
    top: -35px;
    width: 100%;
    clip-path: inset(100% 0 0 0);
}
.line06.animate {
  animation: revealUp 2s ease forwards;
}

@keyframes revealUp {
    to {
        clip-path: inset(0 0 0 0);
    }
}

.line07 {
    position: absolute;
    bottom: 0;
    left: -20%;
    width: 100%;
    clip-path: inset(100% 0 0 0);
}
.line07.animate {
  animation: revealUp 2s ease forwards;
}

@keyframes revealUp {
    to {
        clip-path: inset(0 0 0 0);
    }
}


/*文字左から*/
.text_effect_wrap{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
    -webkit- transform: translateY(-50%) translateX(-50%);
    line-height: 1.0;
        width: 100%;
}
.text_effect {  
    font-family: "Roboto Condensed", sans-serif;
    color: #fff;
    text-align: center;
    position: relative;
     z-index:1;
    line-height: 1.0;
}
.text_effect_wrap .mainimage{
    display: flex;
    justify-content: center;
    align-items: flex-start;
    gap:10px;
    margin: 40px 0 40px;
    flex-wrap: wrap;
}
.text_effect_wrap .mainimage img{
    width: 200px;
}
.text_effect_wrap .main_txt{
    font-size: 14px;
    line-height: 2.0;
    width: 600px;
    margin: auto;
    color: #fff;
}

/*背景の数字部分*/
.text_effect::before {
    font-family: "Noto Serif JP", serif;
    font-weight: bold;
    content: 'Welcome to Neuroanatomy lab';
    position: absolute;
    /*上下中央寄せ*/
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
    -webkit- transform: translateY(-50%) translateX(-50%);
    color: rgba(222 , 180 , 100,0.2);
    z-index: -1;
    font-size: min(4.5vw, 70px);
}


.text_effect .letter {
    display: inline-block;
    line-height: 1em;
    opacity: 0;
}

.text_effect .letters1 {
    font-size: 32px !important;
    margin-bottom: 10px;
    display: block;
}
.text_effect .letters {
    font-size: 20px !important;
        color: #deb464;
}

@media only screen and ( max-width : 768px ) {
    .text_effect_wrap .mainimage img{
    width: 40%;;
}
    .text_effect_wrap .main_txt{
        width: 100%;
    }

    .text_effect_wrap{
        padding: 0 20px;
        box-sizing: border-box;
    }
    .text_effect .letters1{
        font-size: 21px !important;
        
    }
    .text_effect .letters {
    font-size: 16px !important;
}
    .text_effect::before {
        font-size: 37px;
        width: 380px;
            top: 3%;
    }
    
}

/*サブメニュー*/
.submenu{
    display: flex;
    flex-wrap: wrap;
    position: relative;
    margin-top: -100px;
}
.submenu div{
    width: 20%;
    position: relative;
}
.submenu div img{
    width: 100%;
}
.submenu div span.yajirusi{
    position: absolute;
    top: 10px;
    left: 10px;
    color: #00404e;
}
.submenu div span.yajirusi span{
    color: rgba(0 , 64 , 78,0.2);
    font-family: "Roboto Condensed", sans-serif;
    font-size: 16px;
    font-weight: 900;
    line-height: 1.0;
    display: block;
    margin-left: 1px;
}

.yajirusi::before{
    content: "";
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    right: -10px;
    margin: auto;
    width: 20px;
    height: 1px;
    background: #00404e;
    transition: .3s;
}
.yajirusi::after{
    content: "";
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    right: -10px;
    margin: auto;
    width: 8px;
    height: 8px;
    border-left: 1px solid #00404e;
    border-bottom: 1px solid #00404e;
    transform: rotate(-135deg);
    transition: .3s;
}
.submenu div:hover .yajirusi::before{
    width: 30px;
    right: -20px;
}

.submenu div:hover .yajirusi::after{
    right: -20px;
}

.yajirusi_g{
    position: absolute;
        right: 26px;
        bottom: 0;
        margin-right: 30px;
}
.yajirusi_g::before{
    content: "";
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    right: -30px;
    margin: auto;
    width: 20px;
    height: 1px;
    background: #deb464;
    transition: .3s;
}
.yajirusi_g::after{
    content: "";
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    right: -30px;
    margin: auto;
    width: 8px;
    height: 8px;
    border-left: 1px solid #deb464;
    border-bottom: 1px solid #deb464;
    transform: rotate(-135deg);
    transition: .3s;
}
.member a:hover .yajirusi_g::before{
    width: 30px;
    right: -40px;
}

.member a:hover .yajirusi_g::after{
    right: -40px;
}
@media only screen and ( max-width : 890px ) {
    .submenu div p{
        left: 10px;
        display: grid;
    }
    
    
    .submenu div p span{
        margin-left: 0px;
        margin-top: -10px;
        
    }
    
}
@media only screen and ( max-width : 768px ) {
    .submenu{
        margin-top: -50px;
    }
    .submenu div{
        width: 50%;
    }
    
}



.h2hed{
    margin-top: 50px;
}
.h2hed span{
    color: #fff;
    font-size: 23px;
    padding: 10px 0;
}

.h2hed span.h2hed01::before {
    content:"●";
    font-size: 35px;
    margin-top: -4px;
    display: inline-block;
    vertical-align: middle;
    color: #deb464;
}
.h2hed span.h2hed02 {
    font-family: 'Montserrat', sans-serif;
    font-weight: 800;
    font-size: 55px;
    margin-top: -19px;
    vertical-align: middle;
    color: rgba(250, 250, 250, 0.2);
    margin-left: -20px;
    letter-spacing: -0.03em;
    display: inline-block;
        z-index: -1;
    position: relative;
}
.h2hed span.h2hed02::first-letter {
    color: rgba(222 , 180 , 100, 0.5);
}


.h3hed{
    margin: 30px 0 50px;
    color: #fff;
    font-size: 25px;
    text-align: center;
}
.h3hed span{
    font-family: "Noto Serif JP", serif;
    display: block;
    color: rgba(222, 180, 100, 0.2);
    font-size: 50px;
    font-weight: 900;
    margin-top: -60px;
}

.h4hed {
  padding:5px 10px;/*文字周りの余白*/
  color: #002e3a;/*文字色*/
  background: #cdccce;/*背景色*/
  border-left: solid 5px #002e3a;/*左線（実線 太さ 色）*/
    
}
.h5hed {
  padding: 5px 10px;/*文字周りの余白*/
  color: #002e3a;/*文字色*/
  border-left: solid 5px #002e3a;/*左線（実線 太さ 色）*/
    margin: 15px 10px 10px 0;
}

.subtxt{
    margin-bottom: 60px;
    color: #fff;
} 


@media only screen and ( max-width : 768px ) {
    .h2hed{
            margin-top: 30px;
    }
    .h2hed span{
            
        font-size: 18px;
    }
    
    .h2hed span.h2hed01::before{
        font-size: 18px;
        margin-right: 5px;
    }
    .h2hed span.h2hed02{
            font-size: 40px;
        margin-top: -7px;
    }
    .h2hed span.h2hed01::after {
            display: block;     /* ブロックにして強制改行 */
            margin-left: 0;     /* 左のズレをリセット */
            font-size: 28px;    /* スマホ向けに少し小さく */
            margin-top: -5px;    /* 上に余白を追加 */
    }
    .subtxt{
        margin-bottom: 30px;
    }
    .h3hed{
        font-size: 23px;
    }
    .h3hed span{
        font-size: 40px;
        margin-top: -50px;
    }
    
}




/* ---------------------------------------------------------------------------------------------
　   トップお知らせ
--------------------------------------------------------------------------------------------- */
.news{
    padding: 30px 0 80px;
    position: relative;
    z-index: 1;
    margin-top: -80px;
}


.msr_newslist03 {
        margin-bottom: 30px;
        margin-top: 30px;
}
.msr_newslist03 li {
    font-size: 14px;
    border-bottom: solid 1px #fff;
    margin-bottom: 10px;
}

.msr_newslist03 li a {
  box-sizing: border-box;
  color: #fff;
  display: inline-table;
  padding:10px 20px 20px 20px;
  text-decoration: none;
  transition: 0.2s ease-in-out;
  -o-transition: 0.2s ease-in-out;
  -moz-transition: 0.2s ease-in-out;
  -webkit-transition: 0.2s ease-in-out;
  width: 100%;
}
.msr_newslist03 li a:hover {
  opacity: 0.5;
}
.msr_newslist03 li div {
    display: table-cell;
    width: 110px;
}
.msr_newslist03 li p {
    display: table-cell;
    padding-left: 0px;
    vertical-align: middle;
    color: #fff;
    line-height: 1.4;
}

/* 時間の設定 */
.msr_newslist03 li time,.news_page time {
    color: #fff;
    display: block;
    vertical-align: top;
    line-height: 1.8;
    /*    background: #c7c7ca;*/
    padding: 2px 10px 2px 0;
    font-size: 11px;
    border-radius: 20px;
    margin-right: 20px;
        text-align: left;
    
}

@media only screen and ( max-width : 768px ) {
    .news{
            padding: 10px 0 80px;
        margin-top: 0px;
    }
    .msr_newslist03{
    margin-top: 0px;
    }
    .msr_newslist03 li a{
            display: grid;
    }
}
/* ---------------------------------------------------------------------------------------------
　   個別お知らせ
--------------------------------------------------------------------------------------------- */
.newssingle{
    margin-bottom: 100px;
    position: relative;
    z-index: 1;
}
.newssingle .msr_newslist03 ul {
    list-style: none;
    border-left: solid 0px #000;
    padding-right: 0px;
    margin: 15px 15px 30px 15px;
}
.newssingle .msr_newslist03 li {
    text-indent: 0em; 
    padding-left: 0em; 
    line-height: 0; 
    margin-left: 0px;
    list-style-type: none;
    
}
.newssingle .msr_newslist03 li {
    border-bottom: solid 1px #00404e;
        padding-bottom: 10px;
}
.newssingle .msr_newslist03 li::before {
         content: '';
}
.newssingle .msr_newslist03 time{
    color: #00404e;
    display: inline-block;
    line-height: 1.8;
    padding: 4px 10px 4px 0;
    font-size: 11px;
    border-radius: 20px;
}
.newssingle .msr_newslist03 .title{
    font-size: 18px;
    color: #00404e;
    font-weight: bold;
}


/*個別*/
.newssingle .msr_newslist03 li p{
    display: block;
    padding-left: 0px;
    vertical-align: middle;
    color: #00404e;
    line-height: 1.4;
    font-size: 18px;
}
/*一覧*/
.ichiran{
    margin-bottom: 100px;
    position: relative;
    z-index: 1;
}
.ichiran .msr_newslist03 li p{
        color: #00404e;
    font-weight: bold;
}
.ichiran .msr_newslist03 li{
        border-bottom: solid 1px #00404e;
}
.ichiran .msr_newslist03 time{
    color: #00404e;
}


@media only screen and ( max-width : 768px ) {
    .newssingle{
        margin-top: 40px;
    }
}


/*
 ---------------------------------------------------------------------------------------------
　   トップのサイト説明
--------------------------------------------------------------------------------------------- 
*/

.submain {
    padding-bottom: 50px;
    z-index: 2;
    position: relative;
}
.submain02{
    padding: 40px 0 0px;
    display: flex;
    gap:50px;
    align-items: flex-start;
    
}
.submain02 img{
    width: 330px;
    margin: 0 auto 30px;
    display: block;
}
.submain02 .title{
    font-size: 20px;
    font-weight: 500;
    color: #0094c8;
    margin-bottom: 15px;
}
.submain02 .txt{
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 50px;
    line-height: 1.8;
}

.submain03{
    padding: 50px 0 0px;
    display: flex;
    align-items: center;
        
}

.submain03 .title{
    font-size: 23px;
    font-weight: 700;
    color: #003c83;
    width: 400px;
    margin-right: -60px;
}
.submain03 .txt{
    float: left;
    width: 100px;
    height: 100px;
    clip-path:     polygon(0px 0px, 100px 0px, 0px 100px);
    shape-outside: polygon(0px 0px, 100px 0px, 0px 100px);
}
.submain03 .shape-polygon{
    line-height: 1.5;
    letter-spacing: 0.15em;
        margin-left: -60px;
}

@media only screen and ( max-width : 768px ) {
    .submain {
        padding-bottom: 20px;
        margin-top: -100px;
}
    .submain02{
            display: block;
            padding: 10px 0 0px;
    }
    .submain02 .txt{
            margin-bottom: 20px;
    }
    .submain03{
        display: block;
    }
    .submain03 .shape-polygon{
            margin-left: 0px;
    }
    .submain03 .txt{
            height: auto;
    }
    .submain03 .title{
            width: 100%;
    margin-right: 0px;
    }
    
    }


/* ---------------------------------------------------------------------------------------------
　   フッター
--------------------------------------------------------------------------------------------- */

/*TOPへ戻る*/
#page_top_btn{
	position: fixed;
	bottom: 40px;
	right: 40px;
	z-index: 200;
	display: none;
}

#page_top_btn a{
	font-size:25px;
	font-weight:500;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 50%;
	line-height: 100%;
	border: solid #FFF 3px;
	height: 50px;
	width: 50px;
	background-color: #00404e;
	color: #FFF;
}

#page_top_btn a span{
	display:block;
	transform: scaleX(1.5);
    margin-bottom: 5px;
}


#footer{
	background-color:#00404e;
    padding: 20px 0;
    position: relative;
}
#footer .footer p{
	font-size:14px;
    text-align: center;
    color: #fff;
}
#footer .footer{
    padding: 40px 0 10px;
}

#footer .footer p:nth-of-type(1),
#footer .footer p:nth-of-type(2),
#footer .footer p:nth-of-type(3),
#footer .footer p:nth-of-type(4){
    font-size: 17px;
    margin: 2px 0;
}
#footer .footer p:nth-of-type(4){
    margin-bottom: 15px;
}

#footer .footerobi{
    padding: 40px 0;
    text-align: center;
}
#footer .footerobi .copy{
    color:#fff;
        font-size: 11px;
}

#footer .link{
    display: flex;
    gap:7px;
    flex-wrap: wrap;
    margin: 50px 0 20px;
}
#footer .link a{
    width: 16%;
}
#footer .link img{
    width: 100%;
}

#footer .yokowrap{
    margin: 5px auto;
	text-align: center;
	display: block;
}
#footer .yoko{
    text-align: left;
    display: inline-block;
    color: #fff;
    line-height: 1.3;
}
#footer .yoko .yoko_list {
  display: flex;
}
#footer .yoko .yoko_list p:first-of-type{
    width: 65px;
}
#footer .footer .yoko .yoko_list p {
    font-size: 14px;
    text-align: left;
}
#footer .yoko .yoko_list span {
    margin: 0 11px 0 0px;
}


.mto i {
    font-style:normal;
}
.mto i:after {
    content:'@';
}
#footer .mto {
    text-decoration: underline;
    color: #deb464;
}
#footer a{
    font-weight: normal;
    text-decoration: underline;
}

@media screen and (max-width: 768px) {
    
    #footer .link{
        justify-content: center;
            position: relative;
            margin: 20px 0 20px;
    }
    #footer .link a{
        width: 45%;
    }
    #footer .footerobi{
            padding: 10px 0;
    }
    #footer .footer{
            padding: 20px 0;
    }
    #footer .footer p:nth-of-type(1), #footer .footer p:nth-of-type(2), #footer .footer p:nth-of-type(3), #footer .footer p:nth-of-type(4){
            font-size: 14px;
    }
    #page_top_btn{
	bottom: 20px;
	right: 20px;
}
    #page_top_btn a span{
    margin-bottom: 0px;
}
    
}


/* ---------------------------------------------------------------------------------------------
　   メンバー
--------------------------------------------------------------------------------------------- */
.member{
    display: flex;
    flex-wrap: wrap;
    gap:10px;
    position: relative;
    z-index: 1;
}
.member a{
    background: #002e3a;
    padding: 15px 15px 60px;
    width: 24%;
    box-sizing: border-box;
    position: relative;
}
.member div img{
    background: #002e3a;
    width: 100%;
    height: 200px;
    object-fit: cover;
}
.member div p{
    text-align: left;
    color: #fff;
    line-height: 1.2;
    margin-bottom: 10px;
}
.member div p.post,.membertxt div p.post{
    font-size: 12px;
    margin-top: 15px;
}
.member div p.others,.membertxt div p.others{
    font-size: 11px;
}
.member div p.yajirusi_g{
    color: #deb464;
}

/*文字のみ*/
.membertxt{
    display: flex;
    flex-wrap: wrap;
    gap:10px;
}
.membertxt div{
    padding: 15px 15px 60px;
    width: 24%;
    box-sizing: border-box;
    position: relative;
}
.membertxt div p{
    text-align: left;
    color: #fff;
    line-height: 1.3;
    margin-bottom: 10px;
}

@media screen and (max-width: 768px) {
    .dairi .listwrap{
        display: block;
        margin-top: -20px;
    }
    .member{
        display: grid;
        grid-template-columns: repeat(auto-fit, 48%);
        justify-content: center;
    }
    .member a{
            width: 100%;
            padding: 15px 15px 30px;
    }
    .membertxt div{
            padding: 15px 15px 10px;
            width: 47%;
    }
    
    
    
    
    
}




/* メンバーポップアップ */

.modal{
    display: none;
    height: 100vh;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 2;
}
.modal__bg{
    background: rgba(255,255,255,0.9);
    height: 100vh;
    position: absolute;
    width: 100%;
}
.modal__bg_w{
    background: rgba(0 , 64 , 78,0.9);
}
.modal__content{
    background: #00404e;
    left: 50%;
    padding: 40px;
    position: absolute;
    top: 450px;
    transform: translate(-50%, -50%);
    width: 450px;
    height: 600px;
    overflow: auto;
    box-sizing: border-box;
}
.modal__content_w{
    background: #fff;
}


.close_btn{
    display: inline-block;
    vertical-align: middle;
    color: #00404e;
    width: 4em;
    height: .1em;
    background: currentColor;
    position: absolute;
    transform: rotate(45deg);
    cursor: pointer;
    transition: .2s;
    z-index: 1;
    top: 108px;
    left: 50%;
    margin-left: 269px;
}
.close_btn_w{
    color: #fff;
}
.close_btn:hover{
    opacity: 0.5;
}
.close_btn::before {
    content: '';
    position: absolute;

    width: 100%;
    height: 100%;
    background: inherit;
    transform: rotate(90deg);
}

#modal-name{
    font-size: 20px;
    line-height:1.2;
    margin:10px 0;
}
.modal__content p{
    color: #fff;
}
.modal__content_w p{
    color: #000;
    border-bottom: 1px solid #00404E;
    padding-bottom: 15px;
    margin-bottom: 15px;
        text-align: left;
}
.modal__content img{
    width: 300px;
}
.modal__content span.modal_img{
        text-align: center;
        display: block;
}
.modal__content span.modal_txt_wrap{
    width: 300px;
    margin: 16px auto;
	text-align: center;
	display: block;
}
.modal__content span.modal_txt{
    text-align: left;
/*	display: inline-block;*/
}
.modal__content span.modal_txt a{
    color: #deb464;
    text-decoration: underline;
    display: block;
}

@media screen and (max-width: 768px) {
    .modal__content{
            width: 90%;
        top: 373px;
            height: 500px;
    }
    .modal__content img{
            width: 100%;
    max-width: 300px;
    }
    .modal__content span.modal_txt_wrap{
            width: 100%;
    }
    .close_btn{
        left: inherit;
    margin-left: 0px;
    right: 17px;
            top: 88px;
    }
    .modal_txt{
        font-size: 13px;
    }
    #modal-name{
    font-size: 16px;
}
    
    
}

/* ---------------------------------------------------------------------------------------------
　   教室紹介
--------------------------------------------------------------------------------------------- */

.labo{
    position: relative;
    background-color: #00404e;
        height: auto;
    padding-bottom: 80px;
}
.labo img{
    width: 100%;
    position: absolute;
    opacity: 0.3;
}
.labo .labo1{
    
}
.labo .labo1 p {
    margin: 0px 0 0px 0;
    color: #fff;
    line-height: 1.8;
    letter-spacing: 0.15em
}
.circle1wrap{
    margin: 40px auto;
    display: flex;
    justify-content: center;
    gap:15px;
    flex-wrap: wrap;
}
.circle1{
    width: 15vw;
    max-width: 200px;
    height: 15vw;
    max-height: 200px;
    border-radius:50%;
    border: 1px dotted #deb464;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(222 , 180 , 100 , 0.1);
    
}
.labo .labo1 .circle1 p{
    text-align:center;
    line-height: 1.3;
    letter-spacing: 0em;
    color: #deb464;
    font-size: clamp(13px, 1.5vw, 18px);
}
.labo .labo1 .circle1 p span{
    display: block;
    margin-top: 5px;
    font-size: 12px;
}

@media screen and (max-width: 768px) {
    .labo{
        padding-bottom: 40px;
    }
    .circle1{
        width: 35vw;
        height: 35vw;
    }
}