@charset "euc-jp";

/*

    マニュアル用
   
*/

/* ----------------------------------------------------------
    汎用
------------------------------------------------------------- */


/* ----------------------------------------------------------
    サイドナビ
------------------------------------------------------------- */

.sideNav__label:after {
    background: url(../../img/manual/ico_sidenavi_set.png) no-repeat;
}
.sideNav__label--order:after { background-position: 0 0; }
.sideNav__label--mail:after { background-position: 0 -30px; }
.sideNav__label--domain:after { background-position: 0 -60px; }
.sideNav__label--server:after { background-position: 0 -90px; }
.sideNav__label--program:after { background-position: 0 -120px; }
.sideNav__label--database:after { background-position: 0 -150px; }
.sideNav__label--install:after { background-position: 0 -180px; }
.sideNav__label--ftp:after { background-position: 0 -210px; }
.sideNav__label--tool:after { background-position: 0 -240px; }
.sideNav__label--order:after { background-position: 0 0; }

.sideNav__list[data-current="manual-man-order"] .sideNav__item > .sideNav__label--order,
.sideNav__list[data-current="manual-man-domain"] .sideNav__item > .sideNav__label--domain,
.sideNav__list[data-current="manual-man-server"] .sideNav__item > .sideNav__label--server,
.sideNav__list[data-current="manual-man-program"] .sideNav__item > .sideNav__label--program,
.sideNav__list[data-current="manual-man-install"] .sideNav__item > .sideNav__label--install,
.sideNav__list[data-current="manual-man-mail"] .sideNav__item > .sideNav__label--mail,
.sideNav__list[data-current="manual-man-ftp"] .sideNav__item > .sideNav__label--ftp,
.sideNav__list[data-current="manual-man-db"] .sideNav__item > .sideNav__label--database,
.sideNav__list[data-current="manual-man-tool"] .sideNav__item > .sideNav__label--tool {
    font-weight: bold;
    color: #CD0A0D;
    background: #FCF1F1;
}


/* ----------------------------------------------------------
    リンクボックス / .linkBox
------------------------------------------------------------- */

.linkBox {
    margin: 0 0 40px;
    padding: 10px;
    border: 5px solid #f5f5f5;
}
.linkBox .ico {
    left: 1em;
    margin: 0 5px 0 0;
    color: #1b63a7;
}

/* ----------------------------------------------------------
	カテゴリ一覧
------------------------------------------------------------- */

.catList {}

.catList__inner {
    display: flex;
    flex-wrap: wrap;
}

.catListBox {
    float: left;
    width: 465px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0 30px 25px 0;
    padding: 0 0 30px 80px;
    border-bottom: 1px solid #ccc;
}
.catListBox:nth-child(even) {
    margin-right: 0;
}
.catListBox--apply { background: url(../../img/manual/ico_catlist_order.png) no-repeat 15px 0; }
.catListBox--mail { background: url(../../img/manual/ico_catlist_mail.png) no-repeat 15px 0; }
.catListBox--domain { background: url(../../img/manual/ico_catlist_domain.png) no-repeat 15px 0; }
.catListBox--server { background: url(../../img/manual/ico_catlist_server.png) no-repeat 15px 0; }
.catListBox--program { background: url(../../img/manual/ico_catlist_program.png) no-repeat 15px 0; }
.catListBox--security { background: url(../../img/manual/ico_catlist_security.png) no-repeat 15px 0; }
.catListBox--database { background: url(../../img/manual/ico_catlist_database.png) no-repeat 15px 0; }
.catListBox--install { background: url(../../img/manual/ico_catlist_install.png) no-repeat 15px 0; }
.catListBox--ftp { background: url(../../img/manual/ico_catlist_ftp.png) no-repeat 15px 0; }
.catListBox--tool { background: url(../../img/manual/ico_catlist_tool.png) no-repeat 15px 0; }


.catListBox__title {
    margin-bottom: 5px;
    font-size: 22px;
    font-weight: bold;
    color: #113d6b;
}

.catListBox__description {
    color: #666666;
}

.catListBox__inner {
    margin-bottom: 15px;
    padding: 14px;
    border: 5px solid #f5f5f5;
}
.catListBox__inner > ul > li {
    margin-bottom: 10px;
    line-height: 1.2;
}
.catListBox__inner > ul > li:last-child {
    margin-bottom: 0;
}
.catListBox__inner > ul > li > i {
    position: relative;
    top: -1px;
    margin-right: 5px;
}
.catListBox__inner > p {
    margin: 0 0 0 1em;
}

.catList__btnBox {
    text-align: center;
}


/* SP - Tab */
@media only screen and (max-width: 960px) {
    .catListBox {
        float: none;
        width: 100%;
        margin: 0 0 15px 0;
    }
}

/* SP */
@media only screen and (min-width: 0) and (max-width: 767px) {
    .catListBox {
        padding: 0 0 20px 0;
        background-position: 0 0;
    }

    .catListBox__title { padding-left: 55px; }
}

/* Tab */
@media only screen and (min-width: 768px) and (max-width: 959px) {

}


/* ----------------------------------------------------------
	マニュアル一覧
------------------------------------------------------------- */

.manualList {
    margin-bottom: 15px;
    padding: 20px 20px 15px 20px;
    border: 5px solid #f5f5f5;
}

.manualListBox {
    margin-bottom: 15px;
    padding-bottom: 8px;
    border-bottom: 1px dotted #ccc;
}
.manualListBox:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}

.manualListBox__title {
    margin-bottom: 12px;
    color: #999;
    font-weight: bold;
}

.manualListBox__list {
    margin-left: 10px;
}

.manualListBox__item {
    float: left;
    width: 50%;
    margin-bottom: 7px;
}
.manualListBox__item > i,
.manualListBox__subitem > i{
    margin-right: 5px;
}

.manualListBox__item--sub {
    clear: left;
    float: none;
    width: 100%;
}

.manualListBox__sublist {
    margin: 10px 20px 0 10px;
    padding: 12px 12px 5px 12px;
    border: 1px solid #ebebeb;
}

.manualListBox__subitem {
    float: left;
    width: 45%;
    margin-bottom: 7px;
    text-indent: -1.3em;
    padding-left: 20px;
}

.manualList__btnBox {
    text-align: center;
}

/* SP - Tab */
@media only screen and (max-width: 960px) {
}

/* SP */
@media only screen and (min-width: 0) and (max-width: 767px) {

    .manualList {
        padding: 15px 15px 10px 15px;
    }

    .manualListBox__list {
        margin-left: 0;
    }

    .manualListBox__sublist {
        margin-left: 0;
    }

    .manualListBox__item {
        float: none;
        width: 100%;
    }

    .manualListBox__subitem {
        float: none;
        width: 95%;
    }
}

/* Tab */
@media only screen and (min-width: 768px) and (max-width: 959px) {

}

/* ----------------------------------------------------------
    お支払い方法リスト
------------------------------------------------------------- */

.paymentList {}
.paymentList__item {
    float: left;
    margin: 0 13px 13px 0;
}
.paymentList__item:last-child { margin: 0; }

/* SP */
@media only screen and (min-width: 0) and (max-width: 767px) {
    .paymentList__item { width: 40%; }
}


/* ----------------------------------------------------------
    数字マーカー / .numMarker　
------------------------------------------------------------- */
.numMarker {
    padding: 0 6px;
    background: #2f334c;
    color: #FFF;
}


/* ----------------------------------------------------------
キャッシュレス・消費者還元事業
------------------------------------------------------------- */
.sectionCashless{
    background: #FBF8EA;
    border: 1px solid #e7e3d3;
    padding: 15px 10px;
    margin: 0 10px 15px 0;
}

.sectionCashless_inner{
    justify-content: center;
    display: flex;
}

.sectionCashless_left{
    width: 54%;
}

.sectionCashless strong{
    font-weight: bold;
    font-size: 16px;
    color: #eca700;
    margin-bottom: 5px;
}

.sectionCashless p.sectionCashless_left_desc{
    border-top: 1px solid #b3b3b3;
    margin: 5px 0;
    padding-top: 6px;
    font-size: 12px;
}

.sectionCashless img{
    margin: 3px 0 10px 12px;
}

.sectionCashless_info{
    background: #fff;
    width: 80%;
    margin: 5px auto 0;
    padding: 7px;
    border: 1px solid #ccc;
}

.sectionCashless_info p{
    text-indent: -1em;
    padding-left: 1em;
    font-size: 12px;
    margin-bottom: 0;
}

.sectionCashless_info .ico {
    margin: 0 1px 0 0;
    font-size: 17px;
    color: #BF1517;
    position: relative;
    top: -1px;
}

/* SP */
@media only screen and (min-width: 0) and (max-width: 767px) {
    .sectionCashless{
        padding: 15px 10px;
        margin-right: 0;
    }
    .sectionCashless_inner {
        display: block;
    }
    .sectionCashless_info{
        width: 95%;
        margin: 10px auto 0;
    }
    .sectionCashless_left { width: 100%; }
    .sectionCashless_right { text-align: center; }
    .sectionCashless img { margin: 0; }
    .sectionCashless strong { 	font-size: 14px; }
    .sectionCashless p { 	font-size: 11px; }
}


/* Tab */
@media only screen and (min-width: 768px) and (max-width: 959px) {
    .sectionCashless_inner {
        display: flex;
    }
    .sectionCashless_left { width: 54%; }
}

/* ----------------------------------------------------------
    ドメイン取得について
------------------------------------------------------------- */
strong.available {
    color: #8dc221;
}

/* ----------------------------------------------------------
    ドメインの移管について
------------------------------------------------------------- */
.transferLink{
    display: flex;
}
.transferLink li{
    width: 50%;
    margin: 0 10px;
}
.transferLink li a{
    width: 100%;
}

/* SP */
@media only screen and (min-width: 0) and (max-width: 767px) {
    .transferLink{
        display: block;
    }
    .transferLink li{
        width: 100%;
        margin: 0;
    }
    .transferLink li:first-child{
        margin-bottom: 5px;
    }
}

/* ----------------------------------------------------------
    無料独自SSL設定
------------------------------------------------------------- */
.toc-list{
    border: 1px solid #ddd;
    padding: 20px 30px;
    background-color: #f7f7f7;
}
.toc-list--head{
    text-align: center;
    font-weight: bold;
    font-size: 20px;
    color: #333;
    border-bottom: 1px solid #1f65a8;
    padding-bottom: 15px;
    margin-bottom: 26px;
}
.toc-list--body{
    list-style: square;
    color: #1f65a8;
    padding: 0 0 7px 16px;
}
.toc-list--body > li{
    margin-top: 5px;
}
.toc-list--body > li >a{
    font-weight: bold
}
.toc-list--body--child{
    padding-left: 15px;
    list-style: square;
    color: #1f65a8;
}

/* SP */
@media only screen and (min-width: 0) and (max-width: 767px) {
    .toc-list{
        padding: 15px;
    }
    .toc-list--head{
        padding-bottom: 10px;
        margin-bottom: 16px;
        font-size: 16px;
    }
}

/* ----------------------------------------------------------
    新旧リンク
------------------------------------------------------------- */
.reciprocalList {
    border: 1px solid #ccc;
    border-radius: 4px;
    background: #fff;
    text-align: center;
    display: flex;
}
.reciprocalList > li {
    width: 50%;
    border-right: 1px solid #ccc;
}
.reciprocalList > li:last-child {
    border: none;
}
.reciprocalList a {
    display: block;
    padding: 10px;
    text-decoration: none;
}
.reciprocalList a .ico {
    margin-right: 5px;
    position: relative;
    top: -0.1em;
}
.reciprocalList a:hover .reciprocalList__caption {
    text-decoration: underline;
}
.reciprocalList .current {
    pointer-events: none;
}
.reciprocalList .current .reciprocalList__caption {
    font-weight: bold;
    text-decoration: none;
}
.reciprocalList .current .reciprocalList__caption span {
    font-weight: normal;
    color: #999;
    font-size: 12px;
}
/* SP */
@media only screen and (min-width: 0) and (max-width: 767px) {

    .reciprocalList {
        flex-direction: column;
        text-align:left;
    }
    .reciprocalList > li {
        width: 100%;
        border-right:none;
        border-bottom: 1px solid #ccc;
    }
}