@charset "utf-8";
/**
 * TOP用
 * 
 * create: 2023-08-02
 * update: 2023-08-04
 * 
 * @package     NetPost
 * @author      ik
 * @copyright   Copyright (c) 2023 , NetReal
 * @version     NetPost 1.00
 */



body > div.conts {
	padding-bottom: 0;
}


body > div.conts > div.main {

}



/* キャッチ部 */
body > div.conts > div.main > div.catch {
    padding-top: 80px;
    padding-bottom: 80px;
    color: #FFF;
    font-size: 26px;
    font-weight: 700;
    text-align: center;
    line-height: 1.7;
    background-image: url(/img/top/catch_bg.png);
}



/* リード部 */

    body > div.conts > div.main > div.lead {
        max-width: 900px;
        padding-top: 40px;
        padding-bottom: 40px;
    }

        @media screen and (max-width: 991px) {
            body > div.conts > div.main > div.lead {
                padding-left: 12px;
                padding-right: 12px;
            }
        }



    body > div.conts > div.main > div.lead > h3 {
        margin-bottom: 18px;
        font-size: 22px;
        font-weight: 700;
        text-align: center;
    }

    body > div.conts > div.main > div.lead > p {
        line-height: 1.9;
    }



/* 仕組み部 */

    body > div.conts > div.main > div.strct {
        padding-top: 40px;
        padding-bottom: 40px;
        background-color: #51B5B7;
    }

    body > div.conts > div.main > div.strct > h3 {
        margin-bottom: 22px;
        font-size: 22px;
        font-weight: 700;
        text-align: center;
    }

    body > div.conts > div.main > div.strct > div.container { 
        max-width: 900px;

    }

    body > div.conts > div.main > div.strct > div.container > div.row {
        margin-left: -20px;
        margin-right: -20px;
    }

    body > div.conts > div.main > div.strct > div.container > div.row > div {
        max-width: 900px;
        margin-left: auto;
        margin-right: auto;
        padding-left: 20px;
        padding-right: 20px;
    }

        @media screen and (max-width: 991px) {

            body > div.conts > div.main > div.strct > div.container > div.row {
                margin-left: -12px;
                margin-right: -12px;
            }

            body > div.conts > div.main > div.strct > div.container > div.row > div {
                padding-left: 24px;
                padding-right: 24px;
                padding-bottom: 30px;
            }

        }

    /* 写真囲い */
    body > div.conts > div.main > div.strct > div.container > div.row > div > div {
        text-align: center;
    }

    /* 説明部 */
    body > div.conts > div.main > div.strct > div.container > div.row > div > p {
        padding-top: 6px;
    }

        @media screen and (max-width: 991px) {
            body > div.conts > div.main > div.strct > div.container > div.row > div > p {
                text-align: center;
            }
        }



/* メリット */

    body > div.conts > div.main > div.container.merit {
        max-width: 820px;
        padding-top: 40px;
        padding-bottom: 40px;
    }

        @media screen and (max-width: 991px) {
            body > div.conts > div.main > div.container.merit {
                padding-left: 12px;
                padding-right: 12px;
            }
        }


    body > div.conts > div.main > div.container.merit > h3 {
        margin-bottom: 25px;
        font-size: 22px;
        font-weight: 700;
        text-align: center;
    }

    body > div.conts > div.main > div.container.merit > ul > li {
        padding-bottom: 20px;
        font-size: 20px;
    }

    body > div.conts > div.main > div.container.merit > ul > li > i {
        margin-right: 8px;
        color: #51B5B7;
        font-size: 20px;
    }



/* 活用事例 */

    body > div.conts > div.main > div.ex {
        padding-top: 40px;
        padding-bottom: 10px;
        background-color: #cde085;
    }

    body > div.conts > div.main > div.ex > h3 {
        margin-bottom: 30px;
        font-size: 22px;
        font-weight: 700;
        text-align: center;
    }

    body > div.conts > div.main > div.ex > div.container {
        max-width: 1000px;
    }

        @media screen and (max-width: 991px) {
            body > div.conts > div.main > div.ex > div.container {
                padding-left: 12px;
                padding-right: 12px;
            }
        }


    body > div.conts > div.main > div.ex > div.container > div.row {
        margin-bottom: 20px;
    }

    body > div.conts > div.main > div.ex > div.container > div.row > div {
        margin-bottom: 20px;
    }

    body > div.conts > div.main > div.ex > div.container > div.row > div > div {
        background-color: #FFF;
        padding: 15px 25px;
        border-radius: 10px;
    }

    body > div.conts > div.main > div.ex > div.container > div.row > div > div > h4 {
        padding-bottom: 4px;
        font-size: 22px;
        text-align: center;
        border-bottom: 1px solid #9FA0A0;
    }

    body > div.conts > div.main > div.ex > div.container > div.row > div > div > p {
        min-height: 200px;
    }


/* プラン */

    body > div.conts > div.main > div.container.plan {
        max-width: 900px;
        padding-top: 40px;
        padding-bottom: 50px;
    }

        @media screen and (max-width: 991px) {
            body > div.conts > div.main > div.container.plan {
                padding-left: 12px;
                padding-right: 12px;
            }
        }


    body > div.conts > div.main > div.container.plan > h3 {
        margin-bottom: 30px;
        font-size: 22px;
        font-weight: 700;
        text-align: center;
    }

    body > div.conts > div.main > div.container.plan > table {
        width: 100%;
        margin-bottom: 12px;
        border-collapse: collapse; 
    }

    body > div.conts > div.main > div.container.plan > table td {
        width: 25%;
        font-size: 10px;
        text-align: center;
        font-weight: 400;
    }

    body > div.conts > div.main > div.container.plan > table > tbody > tr:first-of-type {

    }


    /* ボーダー */

        body > div.conts > div.main > div.container.plan > table > tbody > tr:first-of-type > td:nth-of-type(n+2){
            border-top: 1px solid #898989;
        }

        body > div.conts > div.main > div.container.plan > table > tbody > tr > td:nth-of-type(2){
            border-left: 1px solid #898989;
            border-right: 1px solid #898989;
        }

        body > div.conts > div.main > div.container.plan > table > tbody > tr > td:last-of-type {
            border-left: 1px solid #898989;
            border-right: 1px solid #898989;
        }

        body > div.conts > div.main > div.container.plan > table > tbody > tr:last-of-type > td:nth-of-type(n+2){
            border-bottom: 1px solid #898989;
        }


    /* 1行目 */

        body > div.conts > div.main > div.container.plan > table > tbody > tr:first-of-type > td {
            padding: 10px 0;
            font-size: 18px;
            font-weight: 700;
        }


    /* 2行目(1ヶ月あたりの価格) */

        body > div.conts > div.main > div.container.plan > table > tbody > tr:nth-of-type(2) > td {
            padding: 16px 0;
            color: #FFF;
            font-size: 22px;
            font-weight: 700;
            line-height: 1;
        }

        /* 2列目 */
        body > div.conts > div.main > div.container.plan > table > tbody > tr:nth-of-type(2) > td:nth-of-type(2) {
            background-color: #8FC31F;
        }

        /* 3列目 */
        body > div.conts > div.main > div.container.plan > table > tbody > tr:nth-of-type(2) > td:nth-of-type(3) {
            background-color: #2EA7E0;
        }

        /* 4列目 */
        body > div.conts > div.main > div.container.plan > table > tbody > tr:nth-of-type(2) > td:nth-of-type(4) {
            background-color: #036EB8;
        }


    /* 3行目(支払方法) */

        body > div.conts > div.main > div.container.plan > table > tbody > tr:nth-of-type(3) > td {
            padding-bottom: 8px;
            font-size: 10px;
            background-color: #E4E4E9;
            line-height: 1.1;
        }

    /* 4行目(作成できるポストの数) */

        body > div.conts > div.main > div.container.plan > table > tbody > tr:nth-of-type(4) > td {
            padding: 20px 0 3px;
            font-weight: 700;
        }

        body > div.conts > div.main > div.container.plan > table > tbody > tr:nth-of-type(4) > td > em {
            font-size: 22px;
            margin-right: 2px;
        }

    /* 5行目(利用できる最大容量) */

        body > div.conts > div.main > div.container.plan > table > tbody > tr:nth-of-type(5) > td {
            font-weight: 700;
        }

        body > div.conts > div.main > div.container.plan > table > tbody > tr:nth-of-type(5) > td > em {
            font-size: 22px;
            margin-right: 2px;
        }

    /* 6行目(共有できるユーザー数) */

        body > div.conts > div.main > div.container.plan > table > tbody > tr:nth-of-type(6) > td {
            _padding: 8px 0px 0px;
            font-weight: 700;
        }

        body > div.conts > div.main > div.container.plan > table > tbody > tr:nth-of-type(6) > td > em {
            font-size: 22px;
            margin-right: 2px;
        }

        /* 2列目 */
        body > div.conts > div.main > div.container.plan > table > tbody > tr:nth-of-type(6) > td:nth-of-type(2) {
            color: #898989;
            font-weight: 400;
        }

    /* 7行目(アクセスログ機能) */

        body > div.conts > div.main > div.container.plan > table > tbody > tr:nth-of-type(7) > td {
            _padding: 8px 0px;
            font-weight: 700;
        }

        body > div.conts > div.main > div.container.plan > table > tbody > tr:nth-of-type(7) > td > em {
            font-size: 22px;
            margin-right: 2px;
        }

        /* 2列目 */
        body > div.conts > div.main > div.container.plan > table > tbody > tr:nth-of-type(7) > td:nth-of-type(2) {
            color: #898989;
            font-weight: 400;
        }


    /* 8行目(情報取得同意画面) */

        body > div.conts > div.main > div.container.plan > table > tbody > tr:nth-of-type(8) > td {
            padding: 8px 0px;
            font-weight: 700;
        }

        body > div.conts > div.main > div.container.plan > table > tbody > tr:nth-of-type(8) > td > em {
            font-size: 22px;
            margin-right: 2px;
        }

        /* 2列目 */
        body > div.conts > div.main > div.container.plan > table > tbody > tr:nth-of-type(8) > td:nth-of-type(2) {
            color: #898989;
            font-weight: 400;
        }


    /* 9行目(受付項目カスタマイズ) */

        body > div.conts > div.main > div.container.plan > table > tbody > tr:nth-of-type(9) > td {
            padding: 8px 0px 40px;
            font-weight: 700;
        }

        /* 2列目,3列目 */
        body > div.conts > div.main > div.container.plan > table > tbody > tr:nth-of-type(9) > td:nth-of-type(2) , td:nth-of-type(3) {
            color: #898989;
            font-weight: 400;
        }



    /* 1列目共通 */

        body > div.conts > div.main > div.container.plan > table > tbody > tr > td:first-of-type {
            text-align: right;
            padding-right: 20px;
            color: #231815;
            font-size: 14px;
            font-weight: 500;
            background-color: #FFF;
        }



/* 活用事例 */

    body > div.conts > div.main > div.trial {
        padding-top: 40px;
        padding-bottom: 40px;
        _background-color: #0d6991;
         background: linear-gradient(90deg, rgb(98, 182, 198), rgb(13, 105, 145));
    }

    body > div.conts > div.main > div.trial > h3 {
        margin-bottom: 30px;
        color: #FFF;
        font-size: 22px;
        font-weight: 700;
        text-align: center;
    }

    body > div.conts > div.main > div.trial > ul {
        text-align: center;
    }

    body > div.conts > div.main > div.trial > ul > li {
        display: inline-block;
        padding-left: 12px;
        padding-right: 12px;
    }
        @media screen and (max-width: 991px) {
            body > div.conts > div.main > div.trial > ul > li {
                margin-bottom: 6px;
            }
        }

    body > div.conts > div.main > div.trial > ul > li > a {
        width: 252px;
        font-size: 22px;
    }



/* リード部 */

    body > div.conts > div.main > div.inf {
        max-width: 900px;
        padding-top: 40px;
        padding-bottom: 40px;
        margin-left: auto;
        margin-right: auto;
    }

        @media screen and (max-width: 991px) {
            body > div.conts > div.main > div.inf {
                padding-left: 12px;
                padding-right: 12px;
            }
        }



    body > div.conts > div.main > div.inf > h3 {
        margin-bottom: 18px;
        font-size: 22px;
        font-weight: 700;
        text-align: center;
    }

    body > div.conts > div.main > div.inf > div > a.tt {
		border-bottom: 1px solid #000;
    }

    body > div.conts > div.main > div.inf > div > div.body {
		display: none;
		padding-left: 1em;
    }