@charset "UTF-8";



/*--------------------------------------------------------
  ユーザー設定スタイル
--------------------------------------------------------*/
/* 共通 */

/* 紫バーをPCのみ消す*/

/* PC（タブレット横含む）では非表示 */
@media screen and (min-width: 769px) {
  #hpb-headerMain {
    display: none;
  }
}

/* スマホでは表示 */
@media screen and (max-width: 768px) {
  #hpb-headerMain {
    display: block;
  }
}


/* 分野名 */
.uni{
  color:#2b2b82;
  font-size: 20px;
  font-family: AR丸ゴシック体E;
   padding: 12px 0px 0px 30px;
  text-align: left;
}

.koshu{
  color:#2b2b82;
  font-size: 30px;
  font-family: AR丸ゴシック体E;
  padding: 8px 0px 0px 60px;
  text-align: left;  
}

.sp-break-eigo {
     font-size: 0.7em;
  }
 
.ju{
    font-size: 16px;
    font-family: AR丸ゴシック体E;
    padding: 10px 0px 0px 270px;  
}


/* スマホ（768px 以下）では .ju を非表示 */
@media screen and (max-width: 768px) {
  .ju {
    display: none;
  }
}

/* スマホ用（画面幅600px以下）の文字サイズ調整 */
@media screen and (max-width: 600px) {
.uni{
     font-size: 1.4em;
     padding: 8px 0px 4px 0px;
     color: black;
     font-weight:bold;
  }
}

/* スマホ用（画面幅600px以下）の文字サイズ調整 */
@media screen and (max-width: 600px) {
 .koshu{
   font-size: 1.9em;
      padding: 2px 0px 6px 70px;
      line-height: 1.4;
      color: black;
　  　font-weight:bold;
  }
}

/* スマホ（例: 768px以下）で改行 */
@media screen and (max-width: 768px) {
  .sp-break-eigo {
    display: block;
    font-size: 0.65em;
    font-weight:bold;
  }

 #hpb-title{
	border-top-width: 0px;
	border-top-style: none;
	border-top-color: #000000;
	padding-top:3px;　　/* スマホ画面　項目上部の空白調整 */
  }


 #hpb-main{    
    padding-top: 0px;  /* スマホ項目下空白調整 */
}
}


/* バナー */

#gaibu a {
  display: block;
  color: #fff;
  text-decoration: none;
  background-color:#3636a3;
  padding: 30px 10px;
  margin:5px 10px;
  border-radius: 3px;
  font-weight: bold;
  font-size: 1.4em;
  text-align: center;
  transition: background-color 0.3s;
}

/* ホバー時の色変化 */

#gaibu a:hover { 
background-color:#6565b8;
transform: scale(1.01);
}


/* 住所 */

.bunya{
      background-color:#cdcdfa; 
      color: #3636a3;  
      font-family: Noto Sans JP;
      font-size: 1.45em;     
      font-weight: bold;
      text-align: center;
      padding: 10px 1px 10px 1px;
      margin:50px 25px 10px 25px;
      border-radius: 4px;;
}

.ad{
   font-size: 1.4em;
   font-family: Noto Sans JP;
   text-align: left;
   padding: 5px 0px 10px 15px;
   margin:15px 10px 25px 12px; 
}

/* スマホ用（画面幅600px以下）の文字サイズ調整 */
@media screen and (max-width: 600px) {
  .bunya {
    font-size: 1.6em;
    padding-left: 14px;
  }
}


/* スマホ用（画面幅600px以下）の文字サイズ調整 */
@media screen and (max-width: 600px) {
  .ad {
     font-size: 1.6em;
     margin-left: 24px;
     padding-left: 14px;
  }
}


/* マップリンク */
#year-map a {
  display: block;
  background-color: #9999FF; /* 紫色 */
  color: #fff;
  text-decoration: none;
  padding: 18px 10px;
  margin:8px 25px;
  border-radius: 4px;
  font-size: 1.3em;
  font-weight: bold;
  text-align: center;
  transition: background-color 0.3s;
}

/* ホバー時の色変化 */
#year-map a:hover {
  background-color: #8080FF; /* 少し明るい紫 */
  transform: scale(1.01);
}


/* メニューバー */

/* スマホ用項目名サイズ */
@media screen and (max-width: 568px) {	
      #hpb-nav li
	{
	 font-size: 1.5em;
	}	
　　}

@media screen and (max-width: 568px) {
　   .en
	{
        padding-left:10px;
        font-weight: bold;
	}	
　　　}

/* copyright */
#hpb-footerMain{
  font-size: 1.3em; /* 文字を少し大きく */       
}

/* スマホ用（画面幅600px以下）の文字サイズ調整 */
@media screen and (max-width: 600px) {
 #hpb-footerMain p{
    font-size: 0.7em;
  }
}

/* ページトップに戻るボタン */
html {
  scroll-behavior: smooth;
}

.pagetop-button {
  position: fixed;
  right: 20px;
  bottom: 40px;
  background-color:#CECEFF;
  color: white;
  width: 50px;
  height: 50px;
  border-radius: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none!important;
  font-size: 30px;
  z-index: 100; /* 他の要素より手前に表示 */
 background-color:rgba(0,0,139,0.2);  
   
}

/* PC表示のときだけ、少し左へずらす */
@media (min-width: 1024px) {
  .pagetop-button {
    right: 100px;   /* 例：右端から60pxに。20→60で左へ40px移動 */
  }
}

@media screen and (max-width: 600px)  {
  .pagetop-button {
   background-color:rgba(0,0,139,0.2);  
   color: white;
   width: 40px;
   height: 40px;
   border-radius: 30px
   font-size: 25px;
  }
}


/* about 専用 */
.gaiyo{
  font-size: 1.4em;
  font-family: Noto Sans JP;
  margin-bottom:40px;
}


/* スマホ用（画面幅600px以下）の文字サイズ調整 */
@media screen and (max-width: 600px) {
  .gaiyo {
    font-size: 1.4em;
    padding-left: 6px; 
    margin-bottom:5px;
   text-indent: -1.0em;
  }
}

.red{
  color: #c7166e;
  font-weight:bold;
  font-size: 1.1em;
}

.photo{   
   margin:30px 0px 100px 12px;   
}

/* スマホ用（画面幅600px以下）の画像 */
@media screen and (max-width: 600px) {
  .photo {
     margin-left: 1.5px; 
  }
}


/* member 専用 */
.member{
  font-size: 1.7em;
  font-family: Noto Sans JP;
  line-height:0.2em;
  margin-bottom:100px; 
}

/* スマホ用（画面幅600px以下）の文字サイズ調整 */
@media screen and (max-width: 600px) {
 .member{
  font-size: 1.7em; 
}
}

.takasa{    
  line-height:1.0em;
  margin-left:20px;
  margin-top:30px;
}


/* リサーチマップリンク */
.takasa a {
  font-size: 0.75em;
  background-color: #9999FF; /* 紫色 */
  color: #fff;
  text-decoration: none;
  margin-top: 2px;
  padding: 4px 10px;
  border-radius: 3px;
  display: inline-block;　/*　transform　はinlineでは機能しない。aタグはinline であるため追加　　*/　　　
}


/* ホバー時の色変化 */
.takasa a:hover {
  background-color: #8080FF; /* 少し明るい紫 */
  transform: scale(1.01);
}

.gakusei{
  font-size: 1.4em;
  font-family: Noto Sans JP;
  font-weight:bold;
  margin:10px 0px 10px 10px; 
}


/* 学生名　表 */
.custom-table {
  font-family: "Noto Sans JP", sans-serif;
  font-size: 1.2rem; /* または 16px や 1.1em など */
}

.custom-table th,
.custom-table td {
  border: none !important;
}


.custom-table td {
  width: 160px; /* 任意の幅に調整できます */
}


/* スマホ用（画面幅600px以下）の文字サイズ調整 */
@media screen and (max-width: 600px) {
 .custom-table {  
　　　 font-size: 1.6em; /* または 16px や 1.1em など */ 
}
}


/* member  prize  pubulication  album　共通 */
.amikake{  
     background:linear-gradient(#C4C6FF,#F7F7FF);
     font-family: Noto Sans JP;
     font-size: 1.6em; 
     color: darkblue;
     font-weight:bold;
}


@media screen and (max-width: 568px) {	
      .amikake
	{
       font-size: 1.5em; 　 /* 1.6→ 1.5*/　
	}	
}


/* publication 専用*/

/* 業績左寄せ */
#information-cont ol {
  padding-left: 2.0em; /* 必要に応じて調整 */
  margin-left: 0;
 
}

/* スマホ表示の調整 */
@media screen and (max-width: 600px) {
  #information-cont ol {
    padding-left: 2.0em; /* 左に寄せる */
    margin-left: 0;
  
  }

  #information-cont li {
    padding-left: 0;
    margin-left: 0;
  }
}

.ronbun{	 
  font-family: Noto Sans JP;
  font-size: 1.4em;
  margin-bottom:20px; 
  text-align: justify;
 }


/* スマホ表示の調整 */
@media screen and (max-width: 600px) {
.ronbun{
 font-size: 1.3em;
   padding-right: 10px;
  }
}

.year{  
  font-weight:bold; 
}

.italic{
  font-style: italic;
}

.komoku{
  font-size: 1.4em;
  font-family: Noto Sans JP;
  font-weight:bold;
   margin-left:4px; 
 
  

  
}

/* album 専用*/

/* 日付 */
.dai-y{
  font-size: 1.4em;
  font-family: Noto Sans JP;
  padding-top: 10px;
  text-align: center;
  font-weight:bold;
  line-height:0.4; 
}


.dai{
  font-size: 1.4em;
  font-family: Noto Sans JP;
  padding-top: 2px;
  text-align: center;
  font-weight:bold;
  line-height:0.3; 
  
}


/* 写真配置 */
img.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

img.left {
  float: left;
  margin-right: 10px; /* 間隔を狭くする */
}

img.right {
  float: right;
  margin-left: 10px; /* 間隔を狭くする */
}


.image-row {
  display: flex;
  justify-content: center;/* 中央寄せ */
  gap: 20px; /* 画像間の隙間 */
  max-width: 500px; /* 画像2枚分＋隙間の幅に合わせて調整 */
  margin: 0 auto; /* 中央寄せ */  
}

.image-row img {
  width: 220px;
  height: auto;
  display: block;
}

.ss{
  margin-bottom:40px;
}

.photo-block {
  margin-bottom: 60px;
}



/*　1枚　少人数　*/　　　
.image-ones {
  max-width: 500px;  
  margin: 0 auto;  
  }


.image-ones img {
  width: 300px;          /* 220px×2 + 20px(gap) = 460px に合わせる */
  height: auto;          /* 縦横比を維持 */
  display: block;
 }


/* 1枚　集合写真　*/
.image-one {
  max-width: 500px;      /* 2枚のコンテナと同じ幅にして中央寄せ */
  margin: 0 auto;
  padding-bottom:50px;
}

.image-one img {
  width: 460px;          /* 220px×2 + 20px(gap) = 460px に合わせる */
  height: auto;          /* 縦横比を維持 */
  display: block;
  margin-left: auto;     /* 中央寄せ（または .center クラスでもOK） */
  margin-right: auto;
}





@media screen and (max-width: 568px) {
  .image-row {
    display: flex;
    flex-direction: column;
    align-items: center;      /* 画像を中央に揃える */
    gap: 0px;
    width: 85%;
  }

  .image-row img {
    width: 100%;               /* 画像サイズを調整 */
    max-width: 300px;         /* 最大サイズの制限（任意） */
    height: auto;
    margin: 0 auto;           /* 中央揃えの補強 */
    display: block;
    text-align: center;       /* 念のため追加（画像には直接効かないが親要素に影響する場合あり） */
    }
}


/* スマホ用（画面幅600px以下）の文字サイズ調整 */
@media screen and (max-width: 568px) {
 .image-one{
    width: 85%;
    display: block; /* imgタグはインライン要素のため、ブロック要素にする */
    margin: 0 auto; /* ブロックレベル要素のものを中央に配置する */      
  }
}

/* スマホ用（画面幅600px以下）の文字サイズ調整 */
@media screen and (max-width: 568px) {
 .image-ones{
     width: 85%;
     display: block; /* imgタグはインライン要素のため、ブロック要素にする */
     margin: 0 auto; /* ブロックレベル要素のものを中央に配置する */     
  }
}

@media (max-width: 600px) {
  .image-ones img {
    width: 100%;
    height: auto;
  }
}


/* スマホ用（画面幅600px以下）の文字サイズ調整 */
@media screen and (max-width: 568px) {
.tks{ 
  font-size: 0.9em;    
}
}

.big img{
  border-radius: 3%;
  margin-bottom:100px;
}

.ohana{
  margin-left:170px;  
}


.ohana img{
  width: 100px;          /* 220px×2 + 20px(gap) = 460px に合わせる */
  height: auto;          /* 縦横比を維持 */
  display: block;
  border-radius: 3%;
}


/* PCでは横並び */
.sp-break {
  display: inline;
}

/* スマホ（例: 768px以下）で改行 */
@media screen and (max-width: 768px) {
  .sp-break {
    display: block;
   line-height:2.6;
  }
}


/* 年度ナビゲーション　publication  album */
#year-menu a {
  display: block;
  background-color: #9999FF; /* 紫色 */
  color: #fff;
  text-decoration: none;
  padding: 6px 15px;
  border-radius: 4px;
  font-weight: bold;
  text-align: center;
  transition: background-color 0.3s;
　
}


#year-menu a:hover {
  background-color: #8080FF; /* 少し明るい紫 */
 transform: scale(1.02);
}


#year2026,#year2025,#year2024, #year2023, #year2022, #year2021, #year2020, #year2019, #year2018, #year2017, #year2016{
   
     background:linear-gradient(#C4C6FF,#F7F7FF);
     font-family: Noto Sans JP;
     font-size: 1.6em;
     color: darkblue;
     font-weight:bold;
     
}

/* メニューバー全体 */
#year-menu ol {
  list-style: none;
  padding: 0;
  margin: 0;
　display: flex;
  gap: 10px;
  flex-wrap: wrap; /* ← ここで折り返しを有効化 */
   border: none; /* 下線を消す */
}

/* スマホサイズで2段にする */
@media screen and (max-width: 600px) {
  #year-menu ol {
    justify-content: center; /* 中央寄せ（任意） */
  }
  #year-menu ol li {
    flex: 1 1 22%; /* 幅を調整して2段に */
    text-align: center; /* 見た目を整える */
    box-sizing: border-box;
  }
}

/* prize 専用*/
.award-section {   
  margin: 20px 10px 10px 10px;
  font-family: "Yu Gothic", "Noto Sans JP", sans-serif;
}

.award-section-2 {   
  margin: 20px 10px 40px 10px;
  font-family: "Yu Gothic", "Noto Sans JP", sans-serif;
}


.main-info {
  font-weight:600;
  font-size: 1.4em;
  text-indent: -1.8em;      /* ■ を左に出す */
  padding-left: 1em;      /* 全体の左余白 */
  margin-bottom: 1em;     /* 下に1行分のスペー
  font-family: Noto Sans JP;
  margin-bottom: 1em; /* 1行分のスペースを空ける */
}


.detail-info p {   
  font-weight:500;
  font-size: 1.4em;
  margin: 0.3em 0; /* 各行の間隔を少しだけ空ける */
  padding-left: 4.0em; /* 左端を揃えるためのインデント調整 */
  text-indent: -3.0em; /* ラベル（受賞：など）を左に出す */
 font-family: Noto Sans JP;
}
 

/* 学会リンク */
.last-line a {
  font-size: 0.9em;
  
  color:#8080FF ;
  
 margin-top: 30px;
　margin-left: 30px;
 padding: 3px 10px;
  border-radius: 2px;
  padding-left: 3.5em; /* 左端を揃えるためのインデント調整 */
  text-indent: -1.0em; /* ラベル（受賞：など）を左に出す */
  transition: background-color 0.2s;
}

/* ホバー時の色変化 */
.last-line a:hover {
  color:#432275 ; /* 少し明るい紫 */
  transform: scale(1.01);
}


/* スマホ用（画面幅600px以下）の文字サイズ調整 */
@media screen and (max-width: 600px) {
  .main-info {
    font-size: 1.4em;
  }
}

/* スマホ用（画面幅600px以下）の文字サイズ調整 */
@media screen and (max-width: 600px) {
  .detail-info p {
    font-size: 1.4em;
  }
}

/* indormation*/

.info{
  font-size: 1.5em;
  font-family: Noto Sans JP;
  padding-left: 20px;   
  margin-bottom:25px;
}

.vis{
  font-size: 1.5em;
  font-family: Noto Sans JP; 
}

.info a {
  color:#6565b8;
  font-weight: bold;
}


.info a:hover {
  color:#3636a3;
}

/* スマホ用（画面幅600px以下）の文字サイズ調整 */
@media screen and (max-width: 600px) {
  .info {
    font-size: 1.50em; 
    margin-left:-16px;
    margin-right:1px;
    margin-top:30px;   
  }
}

/* スマホ用（画面幅600px以下）の文字サイズ調整 */
@media screen and (max-width: 600px) {
  .vis {
    font-size: 1.50em;    
    margin-left:4px;
    margin-right:2px;
    margin-bottom:80px;
  }
}

/* 見出し用の縦バー */
.amikake1 {
  font-size: 1.9em;
  font-family: Noto Sans JP;
  position: relative;
  padding-left: 20px; /* バーと文字の間隔 */
  font-weight: bold; /* 見出しっぽく強調 */
  margin: 1em 0;
}

/* 擬似要素で縦バーを作成 */
.amikake1::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 6px; /* バーの横幅 */
  background-color: #4B0082; /* 濃い紫 */
  border-radius: 1px; /* 角を少し丸める */
}

/* スマホ対応（画面幅600px以下） */
@media (max-width: 600px) {
  .amikake1 {
    padding-left: 10px; /* スマホでは少し狭く */
    font-size: 1.50em; /* 見やすく */
  } 
}



/* =======================================================
  レスポンシブル設定
======================================================= */
@media screen and (max-width: 568px) {
	
	.hpb-parts-hl-style
	{
		border-top-color: #8362cc !important;
		background-color: #FFFFFF !important;
	}
	
}


/* スマホ用（画面幅600px以下）のサイズ調整：70%幅＋中央寄せ */
@media screen and (max-width: 600px) {

  /* #gaibu 内のボタン3つ（見学 / 教員/研究室・附属施設 / 京都薬科大学ホームページ） */
  #gaibu a {
    width: 83%;
    margin-left: auto;
    margin-right: auto;
    /* 余白を少しタイトに（任意） */
    padding: 22px 10px;
    margin-top: 8px;
    margin-bottom: 8px;
    box-sizing: border-box;
  }

  /* 「大学アクセスマップ」ボタン */
  #year-map a {
    width: 83%;
    margin-left: auto;
    margin-right: auto;
    padding: 16px 8px;   /* ほんの少しだけ小さめに（任意） */
    margin-top: 10px;
    margin-bottom: 10px;
    box-sizing: border-box;
  }

  /* 住所ブロックのフォントと余白（既存を少し整える：任意） */
  .ad {
    font-size: 1.6em;
    /* -left: 14px; ← 無効なので削除 */
    padding-left: 14px;
  }
}