body{

background:#111;

color:#ddd;

font-family:
"Microsoft YaHei",
sans-serif;

}



.container{

width:800px;

margin:auto;

padding:50px 0;

}



header{

text-align:center;

margin-bottom:60px;

}



h1{

font-weight:400;

font-size:40px;

}



section{

background:#181818;

padding:30px;

margin-bottom:40px;

border:1px solid #333;

}



h2{

color:white;

border-bottom:1px solid #444;

padding-bottom:10px;

}





.photo{

margin-top:40px;

padding-bottom:30px;

border-bottom:1px solid #333;

}



.photo img{

width:100%;

height:400px;

object-fit:cover;

}



.photo h3{

font-size:24px;

}



.message{

background:#222;

padding:20px;

margin-top:20px;

}



.diary{

text-align:center;

}



input{

background:#222;

border:1px solid #666;

padding:12px;

color:white;

}



button{

padding:12px 25px;

background:#333;

color:white;

border:none;

}



footer{

text-align:center;

color:#777;

padding:30px;

}
.diary-entry{

background:#181818;

padding:30px;

margin-top:40px;

line-height:2;

border-left:3px solid #555;

}


.diary-entry h2{

font-size:20px;

color:#aaa;

}


.diary-entry h3{

font-size:26px;

}


.attachment{

margin-top:50px;

padding:30px;

text-align:center;

border:1px solid #444;

}


.attachment a{

color:white;

font-size:20px;

}
/* ===================
   落岸铃主页专属样式
=================== */


.snow-page {


    background-color:#fff8f0;


    color:#555;


}



.snow-page .container {


    width:80%;


    max-width:900px;


    margin:auto;


    background:white;


    padding:30px;


    border-radius:20px;


    box-shadow:0 5px 20px rgba(252, 188, 188, 0.08);


}



.snow-page h1 {


    color:#8b6f5a;


}



.snow-page h2 {


    color:#9b7761;


    border-left:5px solid #e8c7a5;


    padding-left:12px;


}



.snow-page .moment {


    background:#fffaf5;


    padding:20px;


    margin-top:25px;


    border-radius:15px;


    border:1px solid #f0e3d8;


}



.snow-page .moment img {


    width:700px;


    height:500px;


    object-fit:cover;


    display:block;


    margin:15px auto;


    border-radius:15px;


}



.snow-page .comment {


    background:#f7efe8;


    padding:15px;


    border-radius:10px;


}.snow-page .container {

    background:#ffffff !important;

}.snow-page section {

    background:#ffffff !important;

}
/* 新闻页面 */


.news-page {


background:#f5f5f5;


font-family:"Microsoft YaHei",sans-serif;


}



.news-container {


width:760px;


max-width:90%;


margin:40px auto;


background:white;


padding:50px;


box-shadow:0 0 15px rgba(0,0,0,0.1);


}



.news-header {


border-bottom:3px solid #222;


margin-bottom:40px;


}



.news-header h1 {


font-size:42px;


margin:0;


}



.news-header p {


color:#666;


}




article h2 {


font-size:30px;


line-height:1.5;


}



.news-info {


color:#888;


font-size:14px;


margin:20px 0;


}



article section {


margin:45px 0;


}



article h3 {


font-size:22px;


border-left:5px solid #222;


padding-left:15px;


}



article p {


font-size:16px;


line-height:2;


color:#333;


}



.case-box {


background:#f3f3f3;


padding:20px;


margin:20px 0;


}



.location {


font-size:24px;


font-weight:bold;


text-align:center;


margin:30px;


}



.photo-area {


text-align:center;


}



.photo-area img {


width:500px;


max-width:90%;


margin-top:30px;


}



.photo-area p {


color:#777;


}



.question {


background:#fafafa;


padding:30px;


}



footer {


text-align:center;


margin-top:50px;


}



footer button {


padding:15px 35px;


font-size:16px;


cursor:pointer;


background:#222;


color:white;


border:none;


}/* =====================
   新闻页面覆盖
===================== */


body.news-page {

    background:#f5f5f5 !important;

    color:#333;

}



.news-page .news-container {

    background:#ffffff !important;

    color:#333;

}



.news-page header {

    background:#ffffff !important;

}



.news-page article {

    background:#ffffff !important;

}



.news-page section {

    background:#ffffff !important;

}



.news-page footer {

    background:#ffffff !important;

}



.news-page .case-box {

    background:#f3f3f3 !important;

}



.news-page .question {

    background:#fafafa !important;

}/* =====================
   表面结局页面
===================== */


.bad-end-page {


background:#111;


font-family:"Microsoft YaHei",sans-serif;


}



.end-container {


width:700px;


max-width:90%;


margin:50px auto;


background:#1c1c1c;


color:#ddd;


padding:50px;


box-shadow:0 0 30px rgba(0,0,0,0.5);


}



.end-container h1 {


text-align:center;


font-size:36px;


color:white;


}



.case-title {


text-align:center;


color:#aaa;


margin:20px;


}



.end-container section {


margin:50px 0;


}



.end-container h2 {


border-left:5px solid #888;


padding-left:15px;


color:#eee;


}



.end-container p {


line-height:2;


font-size:16px;


}



.end-container li {


line-height:2;


}



.letter {


background:#222;


padding:35px;


border:1px solid #444;


}



.sign {


text-align:right;


margin-top:40px;


font-style:italic;


}



.ending {


text-align:center;


border-top:1px solid #444;


padding-top:30px;


}
/* =====================
   真结局页面
===================== */


.true-end-page {

    background:#fff8ef;

    font-family:"Microsoft YaHei",sans-serif;

    color:#7b3f35;

}



.true-container {


width:800px;


max-width:90%;


margin:50px auto;


}



.true-container h1 {


text-align:center;


font-size:42px;


color:#8b6f5a;


}



.subtitle {


text-align:center;


color:#999;


margin-bottom:50px;


}




.letter-box {


background:#fffdf8;


padding:50px;


border-radius:20px;


box-shadow:0 5px 25px rgba(0,0,0,0.08);


line-height:2;


font-size:17px;


}



.name-box {

    text-align:left;

    font-size:17px;

    color:#7b3f35;

    margin:20px;

}



.sign {


text-align:right;


margin-top:50px;


font-style:italic;


}




.iceland-photo {


text-align:center;


margin:60px 0;


}



.iceland-photo img {


width:700px;


max-width:100%;


border-radius:20px;


}



.iceland-photo p {


color:#777;


}




.message-box {


background:#fff;


padding:50px;


border-radius:20px;


line-height:2;


box-shadow:0 5px 20px rgba(0,0,0,0.05);


}



.message-box h2 {


text-align:center;


color:#8b6f5a;


margin-bottom:40px;


}



.end-footer {


text-align:center;


margin:60px;


color:#aaa;


letter-spacing:5px;


}
.music-btn{

position:fixed;

right:30px;

bottom:30px;

padding:12px 25px;

border-radius:30px;

border:none;

background:#8b3a32;

color:white;

font-size:15px;

cursor:pointer;

opacity:0.8;

}


.music-btn:hover{

opacity:1;

}