@charset "utf-8";

/***************************************
* Title: 駅すぱあとアプリ お知らせページスタイル
* Date: 2018. 01
* Author: 福井 澪菜
***************************************/

/***************************************
* 初期化（触らないで！）
***************************************/

html {
    font-size: 62.5%; /* = 10px */
    font-family: sans-serif;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}

body {
    margin: 0 auto;
    max-width: 640px;
    font-size: 1.4rem; /* = 14px */
    line-height: 1.5;
    color: #090909;
}

h1 {
    margin: 0;
    padding: 0;
}

h2 {
    margin: 5px 0 10px;
    font-size: 1.8rem;
    color: #4272ad;
    border-bottom: 3px solid;
}

h3 {
    margin: 10px 0 10px;
    font-size: 1.6rem;
}

h4 {
    margin: 25px 0 10px;
}

a {
    color: #ff9100;
}

ol, ul {
    padding-left: 10px;
}

p {
    margin: 0 auto;
}

figure {
    margin: 0;
}

img {
    width: 100%;
}

/***************************************
* メインコンテンツ（たまには触ってよ！）
***************************************/

/* 節・項 */
section {
    margin: 20px auto;
}

/* ボタン型リンク - 標準（オレンジ） */
[class*="btn"] {
    display: block;
    margin: 15px auto;
    padding: 10px;
    max-width: 100%;
    border-bottom: 4px solid #c36e00;
    border-radius: 5px;
    background-color: #ff9100;
    color: #fff;
    text-align: center;
    text-decoration: none;
}

/*イントロ*/
.intro{
    background-color: #f3f3f3;
    padding: 3%;
    margin: 6%;
}

.section{
    background-color: #fff;
    padding: 0 2%;
    margin: 0 2%;
}

/*アウトロ*/
.outro{
    background-color: #f3f3f3;
    padding: 3%;
    margin: 6%;
}

/*メインコンテンツ*/
.time_table_introduction{
    padding: 2% 3% 3%;
    margin: 7% 4%;
}

/*マーカー*/
.marker{
    background: linear-gradient(transparent 40%,#fff8a0 35%);
}

.timeline {
    list-style: none;
}

.timeline > li {
    overflow: hidden;
    margin: 0;
    position: relative;
}
.blank{
    width: 5px;
    height: 5px;
    float: left;
}
.timeline-content {
    width: 89%;
    float: left;
    border-left: 4px #c7cdd8 solid;
    padding-left: 15px;
}
.timeline-content:before {
    content: '';
    width: 14px;
    height: 14px;
    background: #74879e;
    position: absolute;
    left: 0px;
    top: 15px;
    border-radius: 100%;
}
ol, li{
    list-style-type: disc;
    margin-left: 11px;
}

.new_line{
    margin-bottom: 1em;
}

.timeline-gray{
    color: #929292;
}

.timeline-gray.timeline-content:before{
    content: '';
    width: 12px;
    height: 12px;
    background: #74879e;
    position: absolute;
    left: 1px;
    top: 15px;
    border-radius: 100%;
}

.icon{
    border-radius: 5px;
    max-width: 35%;
    height: auto;
    margin-left: 40px
}
/***************************************
* フッタ
***************************************/

footer {
    margin-top: 40px;
    padding: 40px 0 40px;
    background: #4272ad; /* フッタエリアの背景色 */
    text-align: center;
    font-size: 1.2rem;
    color: #fff;
}