文字の色を変えられません。どうすればCSSでの色指定が反映されますか？

Question

お世話になります。
iSaraのサイトを模写してますが、pタグの中身の色を変えられません。色はwhiteにしたいのですが、CSSでcolorにwhiteを指定しても、#ffffffを指定しても反映されません。
どうすれば反映されますか？
なお、iSaraのサイトは下記になります。
https://isara.life/

<div class="second-section">
            <p class="one">まずは２０日間で、<br>月１０万円稼げるスキルを手にいれよう。</p>
            <p class="two">※受講料金は実質０円です。詳しくは資料請求をどうぞ。</p>
            <a href="" class="three">お問い合わせ＆資料請求はこちら</a>
            <p class="four">第４期生：2018年12月３日 ~ 2018年12月22日  ＊締め切りました</p>
            <p class="five">第５期生：2019年４月8日 ~ 2019年4月27日　＊締め切りました</p>
            <p class="six">第６期生：資料請求受付中です</p>
                <div class="SNS_button">
                        <a href="https://twitter.com/share" class="twitter-share-button">Tweet</a>
                        <div id="fb-root"></div>
                        <script async defer crossorigin="anonymous" src="https://connect.facebook.net/ja_JP/sdk.js#xfbml=1&version=v3.2"></script>
                </div>
        </div>

.second-section {
    position: relative;
    text-align: center;
    top: 200px;
    background-color: #EBB94D;
    padding: 35px;
}

.second-section .one .four .five .six {
    color: white;

}

.second-section p {
    text-align: center;
}

.second-section .two {
    background-color: white;
    color: #D84940;
    width: 40%;
}

Answer 1

.second-section .one .four .five .six

この書き方だと
.second-sectionの配下の.oneの配下の.fourの配下の.fiveの配下の.six に対する指定になっているため、現状のHTML構成だとどれもあてはまりません。
並列なのであれば、下記のように1つずつ指定しましょう。

.second-section .one,
.second-section .four,
.second-section .five,
.second-section .six {
    color: white;
}

Comments

[退会済みユーザー]

文字を白くできました！ありがとうございました＼(^o^)／

[m.ts10806]

解決されたようで何よりです。
階層や親子関係など結構最初は慣れないと思いますので
仕様確認や検証を行って確実に身に着けるようにしてくださいね

[退会済みユーザー]

はい！がんばります(*^^*)

Answer 2

.second-section .one .four .five .six {
    color: white;
}

この部分のことでしょうか。こう指定すると、second-sectionクラスの付いた要素の中の、oneクラスの付いた要素の中の、fourクラスの付いた要素の中の･･･、という指定になります。

.second-section, .one, .four, .five, .six {
    color: white;
}

上記のようにすると並列で指定できます。