@charset "utf-8"; 

html {
overflow-y: scroll;
overflow: auto;
scroll-snap-type: y proximity;
}
body,h1,h2,h3,h4,h5,h6,p,dl,dt,dd,ol,ul,li,th,td,a,em,span {
color:#000;
font-family:"Noto Sans JP","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic",sans-serif;
font-family: -apple-system,BlinkMacSystemFont,"Helvetica Neue","Segoe UI","Hiragino Kaku Gothic ProN","Hiragino Sans",Arial,Meiryo,sans-serif;
margin:0;
padding:0;
letter-spacing: 0.064em;
font-weight: 400;
font-feature-settings: "palt";
line-height:1.8;
}
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
th {
font-weight: normal;
}
li {
list-style: none;
}
em{
font-style:normal;
}
img {
border: 0;
vertical-align: bottom;
max-width: 100%;
height: auto;
min-height: auto;
width /***/:auto;
-webkit-transition: 0.3s ease-in-out;
-moz-transition: 0.3s ease-in-out;
-o-transition: 0.3s ease-in-out;
transition: 0.3s ease-in-out;
}
html{
scroll-behavior: smooth;
}

:root {
--primary: rgba(182,55,54,1);
--primary-light: rgba(98,39,38,1);
--secondary: #d2b48c;
--light: #fff;
--dark: #333;
--gray: #666;
--light-gray: #eee;
--transition: all 0.3s ease;
--gradient-bg: linear-gradient(135deg, rgba(210, 180, 140, 0.2) 0%, rgba(139, 69, 19, 0.1) 100%);
--card-shadow: 0 10px 10px rgba(0, 0, 0, 0.05);
--card-border:1px solid rgba(200,200,200,1);
--hover-shadow: 0 15px 35px rgba(0, 0, 0, 0.1);

--primary-color: #5c3e2a;
--secondary-color: #cb9a6b;
--accent-color: #f0c27b;
--text-color: #333;
--bg-color: #fff;
--header-height: 80px;
--transition-speed: 0.4s;
}

body {


scroll-behavior: smooth;

position: relative;
}

a {
text-decoration: none;
color: var(--primary);
transition: var(--transition);
position: relative;
}
a:hover {
color: var(--primary-light);
}
a.animated-link::after {
content: '';
position: absolute;
width: 0;
height: 2px;
bottom: -3px;
left: 0;
background-color: var(--primary);
transition: width 0.3s cubic-bezier(0.65, 0, 0.35, 1);
}
a.animated-link:hover::after {
width: 100%;
}
img {
max-width: 100%;
height: auto;
}
.container {
max-width: 1200px;
margin: 0 auto;
padding: 0 15px;
}
.section {
margin-bottom:6rem;
position: relative;
overflow: hidden;
}
.center {
text-align:center;
}
.has-text-align-center{
text-align: center !important; 
}
.has-text-align-left{
text-align: left !important;
}
.has-text-align-right{
text-align: right !important;
}


#lectures::before {
top: -100px;
left: -100px;
}
#columns::before {
bottom: -100px;
right: -100px;
}
#publications::before {
top: 50%;
left: -100px;
}
#symposium::before {
bottom: -100px;
right: 30%;
}
/* Page loader */
.page-loader {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: var(--light);
display: flex;
justify-content: center;
align-items: center;
z-index: 9999;
transition: opacity 0.3s ease, visibility 0.3s ease;
}
.loader {
width: 150px;
height: 150px;
position: relative;
}
.loader-circle {
width: 100%;
height: 100%;
border: 4px solid rgba(139, 69, 19, 0.2);
border-top-color: var(--primary);
border-radius: 50%;
animation: spin 1s infinite linear;
}
.loader-logo {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 150px;
height: 150px;
display: flex;
justify-content: center;
align-items: center;
font-family: 'Noto Serif JP', serif;
font-weight: 700;
color: var(--primary);
font-size: 14px;
}
@keyframes spin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
/* ヘッダー */
header {
background-color: rgba(255, 255, 255, 0.95);
box-shadow: 0 5px 20px rgba(0, 0, 0, 0.05);
position: sticky;
border-top:5px solid #b63736;
top: 0;
z-index: 1000;
transition: transform 0.3s ease, box-shadow 0.3s ease;
}
header.scrolled {
box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
}
header.hide {
/*transform: translateY(-100%);*/
}
.header-wrapper {
display: flex;
justify-content: space-between;
align-items: center;
padding: 15px;
}
.logo {
font-family: 'Noto Serif JP', serif;
position: relative;
overflow: hidden;
display: flex;
    align-items: center;
}
.logo a {
display: inline-block;
transition: transform 0.3s ease;
}
.logo a img{
height:25px;
}
.logo::after {
content: '';
position: absolute;
bottom: -2px;
left: 0;
width: 100%;
height: 2px;
background: linear-gradient(90deg, var(--primary), var(--secondary), var(--primary));
background-size: 200% 100%;
animation: gradient-shift 3s ease infinite;
}
@keyframes gradient-shift {
0% {
background-position: 0% 50%;
}
50% {
background-position: 100% 50%;
}
100% {
background-position: 0% 50%;
}
}
.logo-area{
display: flex;
padding-left: 1rem;
    flex-direction: column;
    justify-content: space-between;
        flex-wrap: wrap;

}
.logo-area h5,
.logo-area h6{
font-size:11px;
line-height: 1.5;
text-align-last: justify;
}
.logo-area h5{
border-bottom: 1px solid rgba(182, 55, 54, .5);
}
.logo-area h6{
font-size:12px;
}

/* ハンバーガーメニューボタン */
.nav-toggle {
background: transparent;
border: none;
width: 40px;
height: 40px;
position: relative;
cursor: pointer;
z-index: 1001;
outline: none;
}

.hamburger-icon {
position: relative;
width: 30px;
height: 20px;
margin: 0 auto;
}

.hamburger-icon span {
position: absolute;
height:2px;
width: 100%;
background-color:rgba(182,55,54,1);
border-radius: 4px;
left: 0;
transition: all var(--transition-speed) cubic-bezier(0.68, -0.6, 0.32, 1.6);
}

.hamburger-icon span:nth-of-type(1) {
top: 0;
}

.hamburger-icon span:nth-of-type(2) {
top: 8px;
width: 80%;
}

.hamburger-icon span:nth-of-type(3) {
top: 16px;
}

.nav-toggle.active .hamburger-icon span:nth-of-type(1) {
transform: rotate(45deg);
top: 8px;
}

.nav-toggle.active .hamburger-icon span:nth-of-type(2) {
opacity: 0;
width: 0;
}

.nav-toggle.active .hamburger-icon span:nth-of-type(3) {
transform: rotate(-45deg);
top: 8px;
}

/* ナビゲーションメニュー */
.nav-menu {
display: flex;
flex-wrap: wrap;
justify-content: center;
list-style: none;
transition: all var(--transition-speed) ease;
max-width: 700px;
}

.nav-menu li {
margin: 0 10px;
position: relative;
}

.nav-menu li a {
text-decoration: none;
color: var(--text-color);
font-size: 14px;
font-weight: 500;
padding: 6px 4px;
display: block;
position: relative;
transition: color 0.3s ease;
}

.nav-menu li a:hover {
color:  var(--primary);
}

.nav-menu li a::after {
content: '';
position: absolute;
width: 0;
height: 2px;
bottom: 0;
left: 0;

transition: width 0.3s ease;
}

.nav-menu li a:hover::after {
width: 100%;
}

/* ドロップダウンメニュー */
.nav-menu li.has-dropdown {
position: relative;
}

.nav-menu li.has-dropdown > a::before {
content: '\f107';
font-family: 'Font Awesome 6 Free';
font-weight: 900;
margin-left: 4px;
font-size: 12px;
transition: transform 0.3s ease;
}

.nav-menu li.has-dropdown:hover > a::before {
transform: rotate(180deg);
}

.dropdown {
position: absolute;
top: 100%;
left: 0;
width: 200px;
background: white;
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
padding: 10px 0;
border-radius: 4px;
opacity: 0;
visibility: hidden;
transform: translateY(10px);
transition: all 0.3s ease;
z-index: 100;
}

.nav-menu li.has-dropdown:hover .dropdown {
opacity: 1;
visibility: visible;
transform: translateY(0);
}

.dropdown li {
margin: 0;
width: 100%;
}

.dropdown li a {
padding: 8px 15px;
display: block;
font-size: 14px;
}

.dropdown li a:hover {
background: rgba(203, 154, 107, 0.1);
}

/* アニメーションリンク */
.animated-link {
position: relative;
overflow: hidden;
}

.animated-link::before {
content: '';
position: absolute;
top: 0;
left: -100%;
width: 100%;
height: 100%;

transition: all 0.5s ease;
z-index: -1;
}

.animated-link:hover::before {
left: 0;
}

/* ソーシャルアイコン */
.social-icons {
display: flex;
gap: 1.5rem;
}
.nav-menu .social-icons {
margin-top:2rem;
}
.social-icon {
width: 36px;
height: 36px;
background-color: var(--dark);
color: white;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
transition: all 0.3s cubic-bezier(0.65, 0, 0.35, 1);
position: relative;
overflow: hidden;
line-height:1;
text-indent: 2px;
}
.social-icon::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: var(--primary);
transform: scale(0);
transition: transform 0.3s cubic-bezier(0.65, 0, 0.35, 1);
border-radius: 50%;
}
.social-icon i {
position: relative;
z-index: 1;
}
.social-icon:hover,
.social-icon:hover i {
background-color: var(--primary);
color: white;
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}


/* レスポンシブデザイン */
@media screen and (max-width: 1024px) {
.nav-menu {
font-size: 14px;
}

.nav-menu li {
margin: 0 8px;
}
}

.nav-toggle {
display: flex;
align-items: center;
justify-content: center;
}

.nav-menu {
position: fixed;
top: 0;
right: -100%;
                        bottom:0;
height: 100%;
                        min-height:100svh;


flex-direction: column;
background:rgba(255,255,255,.93);
box-shadow: -5px 0 20px rgba(0, 0, 0, 0.1);
                        padding: 80px 30px 30px;
overflow-y: auto;
transition: right var(--transition-speed) cubic-bezier(0.46, 0.03, 0.52, 0.96);
z-index: 1000;
flex-wrap: nowrap;
                        transition: 0.3s ease-in-out;
}

.nav-menu.active {

right:0;
transition: 0.3s ease-in-out;
    width:35vw;
    min-width:320px;

}

.nav-menu li {
margin: 5px 0;
opacity: 0;
transform: translateX(30px);
transition: all 0.4s ease;
width: 100%;
}

.nav-menu.active li {
opacity: 1;
transform: translateX(0);
}


.nav-menu li a {
font-size: 15px;
padding:5px 0;
}
.nav-menu li a:hover {
transform: translateY(0px) !important;
}
/* モバイル用ドロップダウン */
.dropdown {
position: static;
width: 100%;
box-shadow: none;
padding: 0 0 0 15px;
opacity: 0;
height: 0;
overflow: hidden;
visibility: visible;
transform: none;
transition: opacity 0.3s ease, height 0.3s ease;
}

.nav-menu li.has-dropdown.active .dropdown {
opacity: 1;
height: auto;
padding: 5px 0 5px 15px;
}

.nav-menu li.has-dropdown > a::before {
float: right;
}

.nav-menu li.has-dropdown.active > a::before {
transform: rotate(180deg);
}

.overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
                        min-height:100svh;
background-color: rgba(0, 0, 0, 0.3);
opacity: 0;

visibility: hidden;
transition: opacity var(--transition-speed) ease;
z-index: 999;
}

.overlay.active {
opacity: 1;
                        backdrop-filter: blur(3px);
visibility: visible;
}




/* ヒーローセクション */
.hero {
position: relative;
background-color:rgba(250,250,250,1);
overflow: hidden;
margin-bottom: 3rem;
box-shadow: 0 5px 20px rgba(0, 0, 0, 0.05);
min-height:30vh;
display:flex;
align-items: center;
/*border-bottom:1px solid rgba(182,55,54,.1);*/
}
.hero::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: var(--gradient-bg);
z-index: -1;
}
.hero-slider-container {
overflow: hidden;
width: 100%;
}
.hero-slider {
display: flex;
transition: transform 0.7s cubic-bezier(0.65, 0, 0.35, 1);
width: 100%;
}
.hero-slide {
min-width: 80%;
display: flex;
padding: 2rem 0;
opacity: 0.8;
transform: scale(0.95);
transition: opacity 0.7s ease, transform 0.7s ease;
margin: 0 10%;
}
.hero-slide.active {
opacity: 1;
transform: scale(1);
}
.hero-image {
flex: 0 0 42%;
padding: 1rem;
display: flex;
align-items: center;
justify-content: center;
perspective: 1000px;
}
.hero-placeholder {
width: 100%;
display: flex;
align-items: center;
justify-content: center;
border-radius: 10px;
box-shadow: 0 10px 15px rgba(0, 0, 0, 0.1);
position: relative;
overflow: hidden;
transform: rotateY(0deg);
transform-style: preserve-3d;
transition: transform 0.3s ease forwards;
}
.hero-slide.active .hero-placeholder {
animation: placeholder3D 3s ease forwards;
transform-style: preserve-3d;
transition: transform 0.3s ease forwards;
}
@keyframes placeholder3D {
0% {
transform: rotateY(0deg);
}
100% {
transform: rotateY(15deg);
}
}
.hero-placeholder a{
width: 100%;
display:block;
line-height:.5;
height:100%;
}
.hero-placeholder::before {
content: '';
position: absolute;
top: -50%;
left: -50%;
width: 200%;
height: 200%;
background: linear-gradient(45deg, transparent, rgba(255, 255, 255, 0.2), transparent);
transform: rotate(45deg);
animation: shine 6s infinite cubic-bezier(0.65, 0, 0.35, 1);
}
@keyframes shine {
0% {
transform: translateX(-100%) rotate(45deg);
}
20%, 100% {
transform: translateX(100%) rotate(45deg);
}
}
.hero-image:hover .hero-placeholder {
transform: rotateY(0deg);
}
.hero-content {
flex: 0 0 60%;
padding: 2rem;
display: flex;
flex-direction: column;
justify-content: center;
}
.hero-title {
font-family: 'Noto Serif JP', serif;
font-size: 1.8rem;
margin-bottom: 1rem;
color: var(--dark);
opacity: 0;
transform: translateY(20px);
animation: fadeUp 0.3s forwards cubic-bezier(0.65, 0, 0.35, 1);
animation-delay: 0.3s;
}
.hero-text {
color: var(--gray);
margin-bottom: 1.5rem;
opacity: 0;
transform: translateY(20px);
animation: fadeUp 0.3s forwards cubic-bezier(0.65, 0, 0.35, 1);
animation-delay: 0.3s;
}
.hero-link {
display: inline-block;
margin-top: 1rem;
font-weight: 500;
opacity: 0;
transform: translateY(20px);
animation: fadeUp 0.3s forwards cubic-bezier(0.65, 0, 0.35, 1);
animation-delay: 0.7s;
position: relative;
overflow: hidden;
}
.hero-link::before {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 1px;
background-color: var(--primary);
transform: scaleX(0);
transform-origin: right;
transition: transform 0.3s ease;
}
.hero-link:hover::before {
transform: scaleX(1);
transform-origin: left;
}
.hero-link i {
margin-left: 0.5rem;
transition: transform 0.3s cubic-bezier(0.65, 0, 0.35, 1);
}
.hero-link:hover i {
transform: translateX(8px);
}
@keyframes fadeUp {
to {
opacity: 1;
transform: translateY(0);
}
}
.slider-nav {
position: absolute;
top: 50%;
width: 100%;
transform: translateY(-50%);
display: flex;
justify-content: space-between;
padding: 0 1rem;
z-index: 5;
}
.slider-arrow {
width: 30px;
height: 30px;
background-color: rgba(255, 255, 255, 0.9);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
transition: all 0.3s cubic-bezier(0.65, 0, 0.35, 1);
border: 1px solid #b63736;
color: #b63736;
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
opacity: 0.7;
}
.slider-arrow:hover {
background-color: white;
box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
opacity: 1;
color: var(--primary);
}
.slider-dots {
position: absolute;
bottom: 15px;
left: 0;
width: 100%;
display: flex;
justify-content: center;
gap:1rem;
}
.slider-dot {
width: 10px;
height: 10px;
border-radius: 50%;
background-color: rgba(182,55,54,.5);
cursor: pointer;
transition: all 0.3s ease;
}
.slider-dot.active {
background-color: var(--primary);
transform: scale(1.2);
}

/* レスポンシブ対応 */
@media (max-width: 992px) {
.hero-title {
font-size: 1.5rem;
}
}

@media (max-width: 768px) {
.hero-slide {
flex-direction: column;
}
.hero-image,
.hero-content {
flex: 0 0 100%;
}
.hero-placeholder {
height: 200px;
}
}

@media (max-width: 576px) {
.hero-title {
font-size: 1.3rem;
}
.hero-text {
font-size: 0.9rem;
}
.hero-placeholder {
height: 150px;
}
}
/* センター紹介 */
.center-intro {
text-align: center;
padding: 4rem 2rem;
position: relative;
overflow: hidden;
background-image: none; /* 元の背景画像を無効化 */
}

.center-intro::before {
content: "";
position: absolute;
top: 0;
right: 0;

height: 100%;
background-image: url(../images/bg1.svg);
background-repeat: no-repeat;

background-size: contain;
animation: expandBackground 2s ease forwards;
z-index: -1; /* コンテンツの下に配置 */
}
@keyframes expandBackground {
0% {
width: 50%;
opacity: 0;
background-position: right;
}
75% {
width: 50%;
opacity: 0;
background-position: center;
}
100% {
opacity: 1;
width: 100%;
background-position: center;
}
}
.center-intro p {
max-width: 800px;
margin: 0 auto;
font-size: 1.5rem;
line-height:1.8;
font-family: 'Noto Serif JP', serif;
}
/*.center-intro .intro-bg {
position:absolute;
z-index:0;
}*/
.more-link {
display: inline-flex;
align-items: center;
margin-top:5rem;
font-weight: 500;
padding: 0.5rem 1.5rem;
border-radius: 30px;
background-color: transparent;
border: 1px solid var(--primary);
color: var(--primary);
transition: all 0.3s cubic-bezier(0.65, 0, 0.35, 1);
position: relative;
overflow: hidden;
z-index: 1;
background-color:rgba(255,255,255,1);
}
.more-link::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: var(--primary);
z-index: -1;
transform: scaleX(0);
transform-origin: right;
transition: transform 0.3s cubic-bezier(0.65, 0, 0.35, 1);
}
.more-link:hover {
color: white;
}
.more-link:hover::before {
transform: scaleX(1);
transform-origin: left;
}
.more-link i {
margin-left: 0.5rem;
transition: transform 0.3s cubic-bezier(0.65, 0, 0.35, 1);
}
.more-link:hover i {
transform: translateX(5px);
}

/* セクションのスタイル */
.section-title {
font-family: 'Noto Serif JP', serif;
font-size: 1.5rem;
margin-bottom: 1.5rem;
padding-bottom: 0.5rem;
border-bottom: 1px solid rgba(182,55,54,1);
color: var(--dark);
position: relative;
display: inline-block;
width:25%;
}
@media screen and (max-width:800px) {
.section-title {
display:block;
width:100%;
}
}
.section-title::after {
content: '';
position: absolute;
bottom: -1px;
left: 0;
width: 50px;
height: 3px;
background-color: var(--primary);
transition: width 0.3s ease;
}
.section:hover .section-title::after {
width: 100px;
}
/* 定例講座 */
.lecture-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 1rem;
}
.lecture-card {
border: none;
border-radius: 10px;
overflow: hidden;
transition: transform 0.3s cubic-bezier(0.65, 0, 0.35, 1), box-shadow 0.3s cubic-bezier(0.65, 0, 0.35, 1);
background-color: white;
border: var(--card-border);
position: relative;
z-index: 1;
display:block;
}
.lecture-card::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(135deg, rgba(139, 69, 19, 0.05) 0%, rgba(210, 180, 140, 0.05) 100%);
z-index: -1;
opacity: 0;
transition: opacity 0.3s ease;
}

.lecture-card:hover::before {
opacity: 1;
}
.lecture-image {
display: flex;
align-items: center;
justify-content: center;
color: var(--primary);
position: relative;
overflow: hidden;
transform-style: preserve-3d;
perspective: 1000px;
}
.lecture-image img{
width:100%;
filter: grayscale(100%);
}
.lecture-image::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(135deg, rgba(139, 69, 19, 0.2) 0%, rgba(210, 180, 140, 0.2) 100%);
z-index: 1;
opacity: 0;
transition: opacity 0.3s ease;

}
.lecture-card:hover .lecture-image img {
filter: grayscale(0);
}

.lecture-card:hover {
transform: translateY(-10px) scale(1.02);
cursor:pointer;
}
.lecture-content {
padding: 1.5rem;
position: relative;
}
.lecture-date {
display: block;
color: var(--primary);
margin-bottom: 0.5rem;
font-size: 0.9rem;
font-weight: 500;
}
.lecture-title {
font-size: 1.2rem;
margin-bottom: 0.5rem;
line-height: 1.4;
position: relative;
padding-bottom: 0.5rem;
font-family: 'Noto Serif JP', serif;
}
.lecture-title::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 30px;
height: 2px;
background-color: var(--secondary);
transition: width 0.3s ease;
}
.lecture-card:hover .lecture-title::after {
width: 50px;
}
.lecture-speaker {
text-align: right;
margin-top: 1rem;
font-size:1rem;
font-family: 'Noto Serif JP', serif;
font-weight: 500;
}
/* 最新コラム */
#columns p{
margin-top:1rem;
}
.column-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 1rem;
}
.column-card {
display: flex;
border: none;
border-radius: 10px;
overflow: hidden;
transition: all 0.3s cubic-bezier(0.65, 0, 0.35, 1);
background-color: white;
border: var(--card-border);
position: relative;
}
.column-card:hover {

}
.column-image {
flex: 0 0 110px;
background-color: var(--light-gray);
display: flex;
align-items: center;
justify-content: center;
color: var(--primary);
position: relative;
overflow: hidden;
}
.column-image::after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(135deg, rgba(139, 69, 19, 0.1) 0%, rgba(210, 180, 140, 0.1) 100%);
opacity: 0;
transition: opacity 0.3s ease;
}
.column-card:hover .column-image::after {
opacity: 1;
}
.column-content {
flex: 1;
padding: 1rem;
position: relative;
z-index: 1;
}
.column-title {
font-size: 0.95rem;
margin-bottom: 0.5rem;
line-height: 1.4;
transition: color 0.3s ease;
}
.column-card:hover .column-title {
color: var(--primary);
}
.column-author {
font-size: 0.85rem;
color: var(--gray);
position: relative;
padding-left: 15px;
}
.column-author::before {
content: '';
position: absolute;
top: 50%;
left: 0;
width: 10px;
height: 1px;
background-color: var(--primary);
transition: width 0.3s ease;
}
.column-card:hover .column-author::before {
width: 15px;
}
/* 刊行物 */
.publication-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
gap: 1rem;
}
.publication-card {
display: flex;
border: none;
border-radius: 10px;
overflow: hidden;
transition: all 0.3s cubic-bezier(0.65, 0, 0.35, 1);
background-color: white;
border: var(--card-border);
height: 100%;
position: relative;
}
@media screen and (max-width:800px) {
.publication-card {
display:block;
margin-bottom: 1.5rem;
}
}

.publication-card::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 5px;
height: 0;
background-color: var(--primary);
transition: height 0.3s cubic-bezier(0.65, 0, 0.35, 1);
}
.publication-card:hover {
transform: translateY(-7px);
}
.publication-card:hover::before {
height: 100%;
}
.publication-image {
flex: 0 0 240px;
background-color: var(--light-gray);
display: flex;
align-items: center;
justify-content: center;
color: var(--primary);
position: relative;
overflow: hidden;
transition: all 0.3s ease;
}
.publication-image::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(135deg, rgba(139, 69, 19, 0.1) 0%, rgba(210, 180, 140, 0.1) 100%);
z-index: 1;
opacity: 0;
transition: opacity 0.3s ease;
}
.publication-card:hover .publication-image::before {
opacity: 1;
}
.publication-content {
flex: 1;
padding: 1.5rem;
display: flex;
flex-direction: column;
position: relative;
z-index: 1;
}
.publication-title {
font-size: 1.1rem;
margin-bottom: 0.5rem;
line-height: 1.4;
transition: color 0.3s ease;
position: relative;
}
.publication-card:hover .publication-title {
color: var(--primary);
}
.publication-text {
color: var(--gray);
font-size: 0.9rem;
margin-bottom: 1rem;
flex-grow: 1;
}
.publication-price {
font-size: 0.85rem;
color: var(--primary);
margin-top: auto;
font-weight: 500;
display: inline-block;
position: relative;
}
.publication-title::after {
content: '';
position: absolute;
bottom: -3px;
left: 0;
width: 0;
height: 1px;
background-color: var(--primary);
transition: width 0.3s ease;
}
.publication-card:hover .publication-title::after {
width: 100%;
}
.free-label {
display: inline-block;
background-color: var(--primary);
color: white;
padding: 3px 12px;
border-radius: 20px;
font-size: 0.8rem;
margin-top: auto;
box-shadow: 0 3px 10px rgba(139, 69, 19, 0.2);
transition: all 0.3s ease;
transform-origin: center;
}
.publication-card:hover .free-label {
transform: scale(1.1);
box-shadow: 0 5px 15px rgba(139, 69, 19, 0.3);
}
/* シンポジウム */
.symposium-card {
display: flex;
border: none;
border-radius: 10px;
overflow: hidden;
transition: all 0.3s cubic-bezier(0.65, 0, 0.35, 1);
background-color: white;
border: var(--card-border);
margin-bottom: 2rem;
position: relative;
flex-direction: row;
}
@media screen and (max-width:800px) {
.symposium-card {
display:block;
margin-bottom: 1.5rem;
}
}
.symposium-card::before {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 0;
height: 5px;
/*background: linear-gradient(90deg, var(--primary), var(--secondary));
transition: width 0.3s cubic-bezier(0.65, 0, 0.35, 1);*/
z-index: 1;
}
.symposium-card:hover {
/*transform: translateY(-10px);
box-shadow: var(--hover-shadow);*/
}
.symposium-card:hover::before {
width: 100%;
}
.symposium-image {
flex: 0 0 50%;
background-color: var(--light-gray);
display: flex;
align-items: center;
justify-content: center;
color: var(--primary);
position: relative;
overflow: hidden;
}
.symposium-image::after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(135deg, rgba(139, 69, 19, 0.1) 0%, rgba(210, 180, 140, 0.1) 100%);
opacity: 0;
transition: opacity 0.3s ease;
}
.symposium-card:hover .symposium-image::after {
opacity: 1;
}
.symposium-content {
flex: 1;
padding: 1.5rem;
position: relative;
}
.symposium-title {
font-size: 1.2rem;
margin-bottom: 0.5rem;
line-height: 1.4;
position: relative;
display: inline-block;
}
.symposium-title::after {
content: '';
position: absolute;
bottom: -5px;
left: 0;
width: 30px;
height: 2px;
background-color: var(--primary);
transition: width 0.3s ease;
}
.symposium-card:hover .symposium-title::after {
width: 100%;
}
.symposium-subtitle {
font-size: 1rem;
margin-bottom: 1rem;
color: var(--primary);
font-weight: 500;
}
.symposium-text {
color: var(--gray);
margin-bottom: 1.5rem;
}
.symposium-link {
position: absolute;
bottom: 1.5rem;
right: 1.5rem;
padding: 0.5rem 1.5rem;
background-color: var(--primary);
color: white;
border-radius: 30px;
font-weight: 500;
box-shadow: 0 5px 15px rgba(139, 69, 19, 0.2);
transition: all 0.3s cubic-bezier(0.65, 0, 0.35, 1);
overflow: hidden;
z-index: 1;
}
.symposium-link::before {
content: '';
position: absolute;
top: 0;
left: -100%;
width: 100%;
height: 100%;
background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
transition: left 0.7s ease;
z-index: -1;
}
.symposium-link:hover {
transform: translateY(-3px);
box-shadow: 0 8px 20px rgba(139, 69, 19, 0.3);
color: white;
}
.symposium-link:hover::before {
left: 100%;
}
.symposium-link i {
margin-left: 0.5rem;
transition: transform 0.3s ease;
}
.symposium-link:hover i {
transform: translateX(5px);
}
/* フッター */
footer {
background-color: var(--light-gray);
padding: 3rem 0;
position: relative;
overflow: hidden;
}
footer::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 8px;
background-color: var(--primary);
background-size: 200% 100%;
animation: gradient-shift 3s ease infinite;
}
.footer-content {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 2rem;
}
.footer-column h4 {
font-family: 'Noto Serif JP', serif;
font-size: 1.1rem;
margin-bottom: 1rem;
padding-bottom: 0.5rem;
border-bottom: 1px solid var(--secondary);
position: relative;
}
.footer-column h4::after {
content: '';
position: absolute;
bottom: -1px;
left: 0;
width: 30px;
height: 2px;
background-color: var(--primary);
transition: width 0.3s ease;
}
.footer-column:hover h4::after {
width: 50px;
}
.footer-column h4.logo{
line-height: 1;
}
.footer-column h4.logo img{
max-height:20px;
}
.footer-links {
list-style: none;
}
.footer-links li {
margin-bottom: 0.8rem;
position: relative;
padding-left: 15px;
transition: transform 0.3s ease;
}
.footer-links li::before {
content: '';
position: absolute;
top: 50%;
left: 0;
width: 6px;
height: 6px;
border-radius: 50%;
background-color: var(--primary);
transform: translateY(-50%) scale(0.7);
transition: transform 0.3s ease;
}
.footer-links li:hover {
transform: translateX(5px);
}
.footer-links li:hover::before {
transform: translateY(-50%) scale(1);
}
.footer-links a {
color: var(--dark);
transition: color 0.3s ease;
}
.footer-links a:hover {
color: var(--primary);
}
.footer-info p {
margin-bottom: 1rem;
font-size: 0.85rem;
line-height: 1.8;
}
.footer-info em {
font-size: 0.8rem;
}
.footer-info p a {
color:rgba(0,0,0,1);
}
footer .more-link {
margin-top: 1rem;
}

.copyright {
text-align: center;
margin-top: 2rem;
padding-top: 2rem;
border-top: 1px solid #ddd;
font-size: 0.85rem;
color: var(--gray);
position: relative;
}
.copyright::before {
content: '';
position: absolute;
top: -1px;
left: 50%;
transform: translateX(-50%);
width: 100px;
height: 5px;
background-color: var(--primary);
}
/* Back to top button */
.back-to-top {
position: fixed;
bottom: -60px;
right: 30px;
width: 50px;
height: 50px;
background-color: var(--primary);
color: white;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
transition: all 0.3s cubic-bezier(0.65, 0, 0.35, 1);
box-shadow: 0 5px 15px rgba(139, 69, 19, 0.3);
z-index: 99;
opacity: 0;
}
.back-to-top.show {
bottom: 30px;
opacity: 1;
}
.back-to-top:hover {
transform: translateY(-5px);
box-shadow: 0 8px 20px rgba(139, 69, 19, 0.4);
}
/* Animation for counting numbers */
.counter {
display: inline-block;
font-weight: 700;
font-size: 3rem;
color: var(--primary);
margin: 0 0.5rem;
}

/* Animations */
@keyframes fadeIn {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes slideUp {
from {
transform: translateY(30px);
opacity: 0;
}
to {
transform: translateY(0);
opacity: 1;
}
}
@keyframes slideInLeft {
from {
transform: translateX(-30px);
opacity: 0;
}
to {
transform: translateX(0);
opacity: 1;
}
}
@keyframes slideInRight {
from {
transform: translateX(30px);
opacity: 0;
}
to {
transform: translateX(0);
opacity: 1;
}
}
@keyframes zoomIn {
from {
transform: scale(0.9);
opacity: 0;
}
to {
transform: scale(1);
opacity: 1;
}
}
@keyframes pulse {
0% {
transform: scale(1);
}
50% {
transform: scale(1.05);
}
100% {
transform: scale(1);
}
}
/* Animate on scroll classes */
.fade-in {
opacity: 0;
transform: translateY(20px);
transition: opacity 0.6s ease, transform 0.6s ease;
}
.fade-in.show {
opacity: 1;
transform: translateY(0);
}
.zoom-in {
opacity: 0;
transform: scale(0.9);
transition: opacity 0.6s ease, transform 0.6s ease;
}
.zoom-in.show {
opacity: 1;
transform: scale(1);
}
.slide-left {
opacity: 0;
transform: translateX(-30px);
transition: opacity 0.6s ease, transform 0.6s ease;
}
.slide-left.show {
opacity: 1;
transform: translateX(0);
}
.slide-right {
opacity: 0;
transform: translateX(30px);
transition: opacity 0.6s ease, transform 0.6s ease;
}
.slide-right.show {
opacity: 1;
transform: translateX(0);
}

/* レスポンシブデザイン */
@media (max-width: 992px) {
.hero-slide {
flex-direction: column;
}
.hero-image,
.hero-content {
flex: 0 0 100%;
}
.publication-grid {
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}
}




@media (max-width: 576px) {
.lecture-grid,
.column-grid,
.publication-grid {
grid-template-columns: 1fr;
}
.hero-title {
font-size: 1.5rem;
}
.section-title {
font-size: 1.3rem;
}
.back-to-top {
width: 40px;
height: 40px;
bottom: 20px;
right: 20px;
}
}





.contact-area .post{
align-self:center; 
}
.contact-area input,
.contact-area textarea{
box-sizing:border-box;
width:100%;
border:1px solid rgba(255,255,255,1);
background:rgba(204,204,204,.2);
border-right:none;
border-left:none;
border-bottom:none;
line-height:1.6;
}
.contact-area input,
.contact-area textarea{
padding:1rem .75rem;
margin-bottom:0;
}
.contact-area textarea{
margin-bottom:1rem;
}

.contact-area .btn-area input{
color:rgba(255,255,255,1);
background:rgba(120,120,120,1);
padding:10px;
border:none;
line-height:1;
}
.contact-area .btn-area input:hover{
color:rgba(255,255,255,1);
background:rgba(80,80,80,1);
cursor:pointer;
}
.recaptcha-area {
width: 304px;
margin: 0 auto;
margin-bottom:3rem;
display:block;
}


.search-contents .article-title{
margin-top: 3rem;
font-size: 1.2rem;
}
.search-contents p{
padding-top: .5rem;
}
.search-contents .material-symbols-outlined{
font-size: 12px;
padding-top: 3px;
padding-right: 5px;
}



/* ページネーションのスタイル */
.pagination {
margin: 40px 0;
text-align: center;
}

.pagination .nav-links {
display: inline-flex;
align-items: center;
gap: 8px;
background: #f8f9fa;
border-radius: 8px;
padding: 8px;
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
flex-wrap: wrap;
justify-content: center;
max-width: 100%;
}

.pagination .nav-links a,
.pagination .nav-links span {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 40px;
height: 40px;
padding: 8px 12px;
text-decoration: none;
border-radius: 6px;
font-weight: 500;
transition: all 0.3s ease;
color: #333;
border: 1px solid transparent;
white-space: nowrap;
}

.pagination .nav-links a:hover {
background:rgba(182, 55, 54, 1);
color: white;
}

.pagination .nav-links .current {
background:rgba(182, 55, 54, 1);
color: white;
font-weight: 600;
border: 1px solid rgba(182, 55, 54, 1);
}

.pagination .nav-links .prev,
.pagination .nav-links .next {
font-weight: 600;
padding: 8px 16px;
}

.pagination .nav-links a:hover,
.pagination .nav-links .prev:hover,
.pagination .nav-links .next:hover {
background: rgba(182, 55, 54, 1) !important;
border: 1px solid rgba(182, 55, 54, 1);
}

.pagination .nav-links .dots {
color: #666;
cursor: default;
background: transparent;
pointer-events: none;
}

.pagination .nav-links .dots:hover {
background: transparent;
transform: none;
box-shadow: none;
}

/* ページネーション情報のスタイル */
.search-pagination-info {
font-size: 14px;
color: #666;
text-align: center;
margin: 20px 0;
}

/* レスポンシブ対応 */
@media (max-width: 768px) {
.pagination .nav-links {
flex-wrap: wrap;
justify-content: center;
gap: 4px;
}

.pagination .nav-links a,
.pagination .nav-links span {
min-width: 36px;
height: 36px;
font-size: 14px;
}

.pagination .nav-links .prev,
.pagination .nav-links .next {
padding: 8px 12px;
}


}

/* ページコンテンツのスタイル調整 */
.page-content {
line-height: 1.8;
font-size: 16px;
}

.page-content h1,
.page-content h2,
.page-content h3,
.page-content h4,
.page-content h5,
.page-content h6 {
margin-top: 2em;
margin-bottom: 1em;
}

.page-content p {
margin-bottom: 1.5em;
}

.page-content img {
max-width: 100%;
height: auto;
border-radius: 8px;
margin: 1.5em 0;
}




/*検索*/
.search-bar,
.sidebar-widget,
.searchform {
display: flex;
justify-content: center;
align-items: center;
width: 100%;
max-width: 500px;
font-family: Arial, sans-serif;
}
.nav-menu .search-bar{
margin-top: 2rem;
}
.sidebar-widget {
flex-direction: column;
align-items: stretch; /* フォームをフル幅に */
}
.search-bar form,
.sidebar-widget form,
.searchform {
display: flex;
align-items: center;
width: 100%;
background: #ffffff;
border-radius:8px;
padding: 5px 10px 5px 5px;
transition: all 0.3s ease;
box-sizing: border-box; /* パディングによるオーバーフロー防止 */
}
.search-bar form {
box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1);
}
.sidebar-widget form {
border: 1px solid #eee;
}
.sidebar-widget form > div,
.searchform > div {
display: flex;
align-items: center;
width: 100%; /* 内部のdivをフル幅に */
}

.search-bar input[type="text"],
.sidebar-widget input[type="text"],
.searchform input[type="text"] {
flex: 1;
border: none;
outline: none;
padding: 12px 20px 12px 5px;
background: transparent;
color: #333;
min-width: 0; /* フレックス縮小を許可 */
transition: all 0.3s ease;
}

.search-bar input[type="text"]:focus,
.sidebar-widget input[type="text"]:focus,
.searchform input[type="text"]:focus {
flex: 1;
}

.search-bar input[type="text"]::placeholder,
.sidebar-widget input[type="text"]::placeholder,
.searchform input[type="text"]::placeholder {
color: #999;
font-style: italic;
}

.search-bar .search-icon,
.sidebar-widget .search-icon,
.searchform .search-icon {
background: #b63736;
border: none;
border-radius: 50%;
width: 35px;
height: 35px;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
transition: all 0.3s ease;
flex-shrink: 0; /* ボタンの縮小防止 */
}

.search-bar .search-icon:hover,
.sidebar-widget .search-icon:hover,
.searchform .search-icon:hover {
transform: scale(0.85);
}

.search-bar .search-icon i,
.sidebar-widget .search-icon i,
.searchform .search-icon i {
color: #fff;
font-size: 20px;
}

/* ボタンの脈動アニメーション */
@keyframes pulse {
0% {
box-shadow: 0 0 0 0 rgba(0, 123, 255, 0.7);
}
70% {
box-shadow: 0 0 0 10px rgba(0, 123, 255, 0);
}
100% {
box-shadow: 0 0 0 0 rgba(0, 123, 255, 0);
}
}

.search-bar .search-icon:active,
.sidebar-widget .search-icon:active,
.searchform .search-icon:active {
animation: pulse 0.5s;
}

/* スクリーンリーダーテキストの非表示 */
.screen-reader-text {
display: none;
}


/* 検索結果のスタイル調整 */
.search-results-info {
display: flex;

align-items: center;
justify-content: center;
margin-bottom: 20px;
padding: 15px;
background: rgba(182,55,54,0.1);
border-radius: 8px;
}

.search-results-info .search-count {
font-size: 14px;
color: #666;
}

.search-pagination-info {
font-size: 14px;
color: #666;
text-align: center;
margin: 20px 0;
}



.category-posts article.post-item{
display: flex;
    align-items: center;
    margin-bottom: 2rem;
        gap: 1em;
}
.category-posts article.post-item .post-thumbnail {
width: 100px;
}
.category-posts article.post-item .post-thumbnail a,
.category-posts article.post-item .post-thumbnail img{
width: 100%;
}
.category-posts article.post-item .post-txt h2{
font-size:1rem;
margin-bottom: .5rem;
}
.category-posts article.post-item .post-txt p {
font-size:.8rem;
}
.category-posts article.post-item .post-txt p a{
display: block;
}

/* ============================================================ pc */
@media screen and (min-width:800px) {


}
/* ============================================================ sp */
@media screen and (max-width:800px) {
.hero-slide {
display: block;
}
.logo-area{
display:none;
}
}