LYY 靈元院

/* ===== 毛筆風標題字體 ===== */
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+TC:wght@700&display=swap');
/* ===== 全局背景與版面寬度設定 ===== */
body {
background-color: #f7f5f0;
}
.article-wrap {
max-width: 980px;
margin: 40px auto 60px;
padding: 32px 40px 48px;
background: #fbf9f4;
border-radius: 18px;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);
box-sizing: border-box;
font-family: -apple-system, BlinkMacSystemFont, "Noto Sans TC", "PingFang TC",
"Microsoft JhengHei", system-ui, sans-serif;
line-height: 1.9;
color: #333333;
}
/* ===== 毛筆風標題設定 ===== */
.section-title {
text-align: center;
font-size: 32px;
letter-spacing: 0.25em;
color: #4b2e05;
font-family: 'Noto Serif TC', 'DFKai-SB', '標楷體', serif;
margin: 40px 0 24px;
}
/* ===== 首圖：硬性尺寸（建議圖檔至少 1600×900） ===== */
.article-hero-main {
margin: 0 0 32px;
border-radius: 16px;
overflow: hidden;
}
.article-hero-main img {
display: block;
width: 100%;
height: 420px;
object-fit: cover;
}
/* ===== 橫標詩句 ===== */
.article-subtitle {
text-align: center;
font-size: 18px;
line-height: 1.8;
color: #555;
margin-bottom: 40px;
}
.article-subtitle span {
display: inline-block;
}
/* ===== 段落區塊 ===== */
.section {
padding: 24px 0 32px;
border-top: 1px solid #e2ddd6;
}
.section:first-of-type {
border-top: none;
}
.section-body {
font-size: 18px;
line-height: 1.9;
color: #333;
text-align: justify;
}
.section-body p {
margin: 0 0 18px;
}
.section-body::after {
content: "";
display: block;
clear: both;
}
/* ===== 圖文交錯布局：大圖在左、文字在右 ===== */
.section-media {
display: flex;
align-items: center;
gap: 32px;
margin-top: 8px;
}
.section-media.reverse {
flex-direction: row-reverse;
}
.section-media-figure {
flex: 1 1 48%;
border-radius: 14px;
overflow: hidden;
}
.section-media-figure img {
display: block;
width: 100%;
height: 360px;
object-fit: cover;
}
.section-media-text {
flex: 1 1 52%;
}
/* ===== 小圖：線條感、法器特寫（側插圖） ===== */
.section-media-small {
float: right;
margin: 0 0 12px 24px;
border-radius: 12px;
overflow: hidden;
}
.section-media-small img {
display: block;
width: 220px;
height: 220px;
object-fit: cover;
}
/* ===== 聯絡區塊（文中那塊「閉院靜修」） ===== */
.contact-block {
margin-top: 32px;
padding: 24px 20px;
background: #f5efe6;
border-radius: 14px;
border: 1px solid #e0d6c4;
}
.contact-title {
text-align: center;
font-size: 24px;
letter-spacing: 0.2em;
color: #4b2e05;
margin: 0 0 16px;
font-family: 'Noto Serif TC', 'DFKai-SB', '標楷體', serif;
}
.contact-info {
text-align: center;
font-size: 18px;
line-height: 1.9;
color: #3b3b3b;
}
.contact-info a {
color: #6a4b2b;
text-decoration: none;
border-bottom: 1px dotted rgba(106, 75, 43, 0.4);
}
.contact-info a:hover {
border-bottom-style: solid;
}
.contact-note {
font-size: 16px;
color: #7a7063;
margin-top: 12px;
}
/* BeClass 按鈕樣式 */
.contact-btn {
display: inline-block;
margin-top: 12px;
padding: 10px 32px;
border-radius: 999px;
border: 2px solid #e3efe5;
background: rgba(255,255,255,0.96);
font-size: 15px;
letter-spacing: 4px;
color: #333;
text-decoration: none;
box-shadow: 0 0 0 1px rgba(180,196,184,0.7);
cursor: pointer;
transition: all 0.2s ease;
}
.contact-btn:hover {
background: #e7f0e7;
transform: translateY(-1px);
}
/* ===== RWD：手機版自動改為直式排列 ===== */
@media screen and (max-width: 768px) {
.article-wrap {
margin: 20px auto 40px;
padding: 20px 16px 32px;
border-radius: 0;
box-shadow: none;
}
.article-hero-main img {
height: 260px;
}
.section-title {
font-size: 24px;
letter-spacing: 0.18em;
margin: 28px 0 18px;
}
.section-body {
font-size: 16px;
}
.section-media,
.section-media.reverse {
flex-direction: column;
}
.section-media-figure img {
height: 260px;
}
.section-media-small {
float: none;
margin: 0 auto 16px;
text-align: center;
}
.section-media-small img {
width: 220px;
height: 220px;
}
.contact-block {
padding: 18px 14px;
}
.contact-title {
font-size: 20px;
}
.contact-info {
font-size: 16px;
}
}
/* ===== 頁尾聯絡表單（同截圖形式，不跳頁）===== */
#ly-contact{
width:100%;
padding:40px 0 60px;
background:url(https://pic.pimg.tw/kinkiosel/1503575314-4232270136.png) center center / cover no-repeat;
}
#ly-contact .ly-contact-inner{
max-width:1100px;
margin:0 auto;
padding:0 24px;
box-sizing:border-box;
}
#ly-contact .ly-contact-text{
text-align:center;
font-size:20px;
line-height:1.9;
letter-spacing:0.15em;
color:#6c5a34;
margin:0 0 24px;
}
/* 表單整體 */
#ly-contact .ly-contact-form{
max-width:900px;
margin:0 auto;
}
#ly-contact .ly-row{
display:flex;
align-items:center;
gap:16px;
margin-bottom:12px;
}
/* 欄位寬度 */
#ly-contact .ly-field-half{
flex:1 1 50%;
}
#ly-contact .ly-field-full{
flex:1 1 100%;
}
/* 輸入框樣式 */
#ly-contact .ly-field input{
width:100%;
box-sizing:border-box;
padding:12px 18px;
border-radius:26px;
border:2px solid #e36a6a;
background:rgba(255,255,255,0.96);
font-size:16px;
color:#333;
outline:none;
}
#ly-contact .ly-field input::placeholder{
color:#c0c0c0;
}
/* 下方一列：左按鈕右社群 */
#ly-contact .ly-row-bottom{
margin-top:8px;
}
/* 送出按鈕 */
#ly-contact .ly-submit-btn{
padding:12px 46px;
border-radius:999px;
border:2px solid #f1f6f4;
background:rgba(255,255,255,0.96);
font-size:18px;
letter-spacing:0.4em;
color:#333;
cursor:pointer;
box-shadow:0 0 0 3px rgba(255,255,255,0.45);
transition:all .2s ease;
}
#ly-contact .ly-submit-btn:hover{
background:#e7f0e7;
transform:translateY(-1px);
}
/* 社群 icon */
#ly-contact .ly-social{
margin-left:auto;
display:flex;
align-items:center;
gap:12px;
}
#ly-contact .ly-social a{
display:inline-block;
width:48px;
height:48px;
border-radius:8px;
overflow:hidden;
}
#ly-contact .ly-social img{
width:100%;
height:100%;
display:block;
}
/* 手機版 */
@media screen and (max-width:768px){
#ly-contact{
padding:28px 0 40px;
}
#ly-contact .ly-row,
#ly-contact .ly-row-bottom{
flex-direction:column;
align-items:stretch;
}
#ly-contact .ly-social{
margin-left:0;
justify-content:center;
}
#ly-contact .ly-submit-btn{
width:100%;
text-align:center;
}
}


穿過五欲六塵的層層煙迷，
俯首越過靜謐陰翳；
靜聽內在神性靈喚，
照鑑明台真理。

靈．元靈本源　元．自性本始　院．謐靜空間

靈元院緣起與法脈

靜心修持的靈性空間美學