@charset "utf-8";

.sp{ display: none !important; }

@media screen and (max-width: 1100px) {
  #content{ width: 100%; font-size: 1.7vw; }
}

@media screen and (max-width: 810px) {
  #MainArea{ font-size: 2.6vw; background-size: 200% auto; }
  #content{ width: 100%; font-size: 2.6vw; }
  #MainImgArea { width: 100%; left: auto; font-size: 2.6vw;}
}
@media screen and (max-width: 550px) {
  #MainArea{ font-size: 3.4vw; }
  #content{ font-size: 3.4vw; }
  #MainImgArea { font-size: 3.4vw;}
}

@media screen and (max-width: 810px) {
  #MainImgArea::before,
  #MainImgArea .shoulder,
  #MainImgArea #mainttxt .mainline,
  #MainImgArea #mainttxt:before,
  #MainImgArea #mainttxt:after { display: none;}
  #MainImgArea #mainimg{ display: block;}
  #MainImgArea #mainttxt { width: 100%; padding: 0;}
  #MainImgArea .read { background: #000;}
  #MainImgArea .read p{ padding: 0 8% 3em; margin: 0;}

  #MainImgArea #mainph { width: 100%; margin-top: 0; padding-bottom: 0;}
  #MainImgArea #mainph img { width: 100%; }
  #MainImgArea #mainph .mainph_txt { width: 90%; padding: 0 1em; margin: 2em auto; box-sizing: border-box;}
  #MainImgArea #mainph .mainph_txt .pro { max-width: 100%;}
  



  .pc{ display: none !important; }
  .sp{ display: block !important; }
  body { min-width: auto; }
  .nbo_header,.nxt_header{ display: none; }
  #sp_header{ background: #fff; text-align: center; padding: 5px; }
  #sp_header img{ width: 210px; margin: 0 auto; padding: 5px 0; }
  .social_buttons{ width: 95%; margin: 0 auto;  }
  .social_buttons li { margin-right: 5px; }
  .bnr{ right: 0; align-items: center; bottom: -20%; width: 100%; padding: 5% 3%; background-color: rgba(255,255,255,0.8); max-width: 100%;  }
  .bnr a.pagetop{ padding-right: 0; width: 15%; }
  .bnr a.img{ max-width: 100%; width: 82%; border: 2px solid #4186fd; }
  .bnr.on{ right: 0; }
  
  
  
  a.linkBtn { width: 90%; margin-top: 0;  }
  a.linkBtn:before{ left: 3px; top: 3px; width: calc(100% - 8px); height: calc(100% - 8px); border-radius: 6px; }
  
  #content-inner{ padding-top: 0; }
  #index{ display: none; }

  .Account h2 span::before { display: none;}
  .Account h2 { font-size:150%; height: 6em; }
  .Account h2::before {  }
  .Account h2 span{ line-height: 1.4; width: 100%; background-size: 100% auto; }

.Account { padding-top: 1.5em; }

.Account.type2 { width:86%; }
.Account.type2 h3 { font-size:110%; }


  .acc { padding:4% 2%; box-sizing:border-box; }
  .acc > p { width: 100%; }
  .acc .st { margin-top:.5em; }
  .acc.type2,.acc.type3 { width:90%; }
  .acc.type3 { margin-left: 5%;}
  
  .flex2 { display:block; }
  .flex2 > div{ margin-top:1.3em; width:100%; }
  
  .new:after{ right: -10px; top: -10px; width: 40px; height: 40px; }
  
  ul.logolist{ width: 90%; margin: 0 auto; padding: 0 0; justify-content: space-between; text-align: center; }
  ul.logolist li{ padding: 3% 0; width: 48%; }
  ul.logolist li a{ max-width: 230px; margin:  auto; }
  ul.logolist li a.movlink:before{ width: 80%; left: 10%;  }


  .link-box{  }
  .link-box > li{ padding: 5%; }
  .link-box > li a{ display: block; font-size: 140%;}
  .link-box > li a span{ display: block; text-align: left; margin-top: .5em; }

  .fig{ margin: 20px 0; width: 100%; margin-left: 0; }
  .fig .figtxt h3{
  margin-left: 1em;
  font-size: 100%;
}
  .fig > p{ font-size: 90%;}
  .fig h3 { font-size:85%;  }
  
  .photo{ position:static; width:100%; }
  .photo.R, .photo.L { float: none; transform: translateX(0); margin: 1em auto 2em; }
  .photo.R { text-align: right;}
  .photo.R > p,.photo.L > p { padding: 0; }

  .ph:before{ display:none; }

  .photoW{
}
.photoW > div{ display: block; }
.photoW .txt{ gap: .7rem; }
.photoW .txt .name { font-size:95%; }
.photoW .txt p:not(.name) { font-size:75%; padding-right: .7rem; }
.photoW.R > div{  }
.photoW.R .ph{ }
.photoW.R .txt{  }


.ph-wid { transform: translateX(0); }
  
  .menu.type2 h2{ background-color: #003571; font-size: 100%; text-align: center; }
  .menu.type2 ul{ background-color: #e1ecf3; }
  .menu.type2 ul li a{ font-size: 110%; }
  #footArea { margin: 30px auto 0; padding: 5% 0; }
  #footArea > div{ padding: 0 5% 15px; }

  .footArea .fin{ width:100%; }
  .footArea{ width:85%; padding:0 1em; }

  .logo ul{ justify-content:space-around; gap:3rem; flex-wrap: wrap; }
  .logo ul li{ width:30%; }
  .logo ul li.uniadex{ width:80%; }
  .logo ul li.ctc{ width:35%; }
  
  #ContentsArea {
	overflow: hidden;
}
  .contact-logo{ flex-direction: column; align-items: center; gap: 1em; }
  .contact-logo__txt{ text-align: center; }
  .contact-logo img{ width: 30%;}
  

}

@media screen and (max-width: 550px) {
  .acc .st ,.acc > p { font-size: 100%; }
  .photo ,.fig .figtxt { font-size:85%; }
  .Account h2 { }

  .logo{ padding: 2rem 3rem 3rem; }
  .logo ul li{ width:50%; }
  .logo ul li.uniadex{ width:100%; }
  .logo ulo li.ctc{ width:55%; }

  

}