@charset "UTF-8";
/* -----------------------------------------------
    約束の日 汎用フレーム
-----------------------------------------------*/

/* 共通
------------------------------------------------------------ */
body{
    overflow-x:hidden;
}
header,
footer{
    width:100%;
    background:#fff;
}
.contents_wrapper{
    margin:0 auto 40px;
    padding-bottom:40px;
    background:#fbf8e9;
    font-size:16px;
    line-height:1.6;
}
/* フォント */
.main_menu_list li,
a.post_btn,
a.consultation_btn,
.contents_wrapper h2,
.contents_wrapper h3,
p.txt_heading,
.count_posts_ttl,
.count_posts_number,
.chronology_box .chronology_ttl .year,
.completed_ttl{
    font-family:'Kosugi Maru', sans-serif;
    font-feature-settings:"palt";
    letter-spacing:0.2em;
}

/* メインヴィジュアル
------------------------------------------------------------ */
.mainArea{
    position: relative;
    padding:20px 0 0;
}
.mainArea::after{
    position: absolute;
    content:"";
    top:100px;
    left:0;
    width:100%;
    height:25%;
    background:#39bbd2;
    border-top:7px solid #eabf18;
    border-bottom:7px solid #eabf18;
    z-index:1;
}
.mainArea .mainArea_inner{
    position: relative;
    margin:0 0 20px;
    z-index:5;
}
/* h1 */
.mainArea .mainArea_inner h1{
    margin:0 auto;
    width:250px;
}
.mainArea .mainArea_inner h1 img{
    width:100%;
}
/* 約束を投稿するボタン */
a.post_btn{
    display:block;
    margin:0 auto 40px;
    padding:10px 0;
    width:calc(100% - 20px);
    max-width:600px;
    background:#eabf18;
    font-size:28px;
    color:#fff;
    text-align:center;
    text-decoration:none;
    border-radius:10px;
    box-shadow: 0 5px 0 #c59f0d;
}
a.post_btn:hover{
    background:#ff8c00;
    box-shadow: 0 5px 0 #b36200;
}

/* 約束の日コンテンツ
------------------------------------------------------------ */
/* h2 */
.contents_wrapper .about_promiseday_ttl,
.contents_wrapper .history_promiseday_ttl,
.contents_wrapper .form_promiseday_ttl{
    position: absolute;
    top:0;
    left:50%;
    padding:20px 0;
    width:100%;
    font-size:28px;
    line-height:1.2;
    text-align:center;
    color:#39bbd2;
    border-bottom:1px solid #eabf18;
    transform: translateX(-50%);
    z-index:+1;
}
/* コンテンツブロック */
section,
.section_inner{
    position: relative;
}
.section_inner{
    margin:0 auto 40px;
    padding:120px 0 25px;
    width:calc(100% - 20px);
    max-width:1040px;
    background:#fff;
    border-radius:25px;
    border:1px solid #39bbd2;
}

/* 画面サイズ別
----------------------------------------------------------------*/
@media screen and (max-width:350px){
    .contents_wrapper .about_promiseday_ttl,
    .contents_wrapper .history_promiseday_ttl,
    .contents_wrapper .form_promiseday_ttl,
    a.post_btn{
        font-size:26px;
        letter-spacing:0.05em;
    }
}
