@charset "euc-jp";
/*

    申し込みフォーム用スタイル
   
*/

/* =================================================================


    レイアウト共通


================================================================== */
body {
    visibility: visible !important;
    padding: 25px 0;
    background: url(../img/common/bg_grid.png);
}
.w200 { width: 200px !important; }
.ie8 .holder-sml {
    width: 940px;
    margin: 0 auto;
}
.table { margin-bottom: 20px; }

.test-none {
	display: none;
}
.test-show {
	display: block!important;
}

/* ----------------------------------------------------------
    分岐ボタン / .branch
------------------------------------------------------------- */
.branch {}
.branch > :last-child { margin-bottom: 0; }

.branch_ttl {
    margin-bottom: 10px;
    font-size: 20px;
}

.branch_text {
    margin-bottom: 15px;
    text-align: center;
    font-size: 12px;
}

.branch_btn { text-align: center; }
.branch_btn .btn {}

.order_msg { 
    margin: 0 80px 40px 80px;
}

.order_link {
    margin-bottom: 40px;
    text-align: center;
}

.ie8 .branch {
    margin-bottom: 20px;
    width: 400px;
}
.ie8 .branch_left { float: left; }
.ie8 .branch_right { float: right; }
.ie8 .order_ttl { margin-bottom: 30px; }
.ie8 .order_logo-txt {
    margin-left: 10px;
    font-weight: bold;
    font-size: 18px;
}
.ie8 .branch_new-ttl ,.branch_login-ttl {
    padding: 20px 0;
    font-size: 20px;
}
.ie8 .btn_new {
    position: relative;
    padding-top: 28px;
    height: 77px;
    display: block;
    line-height: 1.2;
    text-decoration: none!important;
    font-size: 20px;
}
.ie8 .btn_login {
    position: relative;
    height: 105px;
    display: block;
    line-height: 105px;
    text-decoration: none!important;
    font-size: 20px;
}

.ie8 .branch_btn .ico_chevron-right {
    position: absolute;
    right: 25px;
    top: 43px;
}

.ie8 .branch_btn .btn { width: 368px; }

/* ----------------------------------------------------------
   申し込み / .order
------------------------------------------------------------- */
.order {
    background: #fff;
    -webkit-box-shadow: 0 0 2px #999;
    -moz-box-shadow: 0 0 2px #999;
    box-shadow: 0 0 2px #999;
}
.ie8 .order { border: 1px solid #ccc; }
.order_header {
    margin-bottom: 30px;
    padding: 25px 20px 0;
}
.order_logo {
    margin-bottom: 20px;
    text-align: center;
}
.order_header > p {
	text-align: center;
}

.order_ttl { text-align: center; }

.branch_new-ttl {
    text-align: center;
    color: #fff;
    background-color: #2466ab;
}
.branch_login-ttl {
    text-align: center;
    color: #fff;
    background-color: #29517c;
}

.branch_body {
    padding: 20px 30px;
    border: 1px solid #b9b9b9;
    border-top: none;
}

.order_inner { 
    margin-left: 10px;
    margin-bottom: 20px;
}

.order_sub-ttl {
    position: relative;
    margin: 0 0 10px;
	padding-left: 10px;
    font-size: 16px;
    font-weight: bold;
    line-height: 1.2;
}
.order_sub-ttl:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 4px;
    height: 23px;
    background: #1a6bb5;/* Old Browsers */
    background: -moz-linear-gradient(top, #5c94ca 0, #1a6bb5 100%); /* FF3.6+ */
    background: -webkit-gradient(left top, left bottom, color-stop(0%, #5c94ca), color-stop(100%, #1a6bb5));/* Chrome, Safari4+ */
    background: -webkit-linear-gradient(top, #5c94ca 0, #1a6bb5 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #5c94ca 0, #1a6bb5 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #5c94ca 0, #1a6bb5 100%); /* IE 10+ */
    background: linear-gradient(to bottom, #5c94ca 0, #1a6bb5 100%);/* W3C */
    -webkit-box-shadow: 0 0 1px #aaa;
    -moz-box-shadow: 0 0 1px #aaa;
    box-shadow: 0 0 1px #aaa;
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#5c94ca', endColorstr='#1a6bb5', GradientType=0 );/* IE6-9 */
}
.order_body {
    margin-bottom: 50px;
    padding: 0 40px;
}
.order_body > :last-child { margin-bottom: 0; }
.order_body_btn .btn { margin: 0 5px 5px; }
.order_footer {
    padding: 35px 10px 10px;
    border-top: 1px solid #ccc;
    color: #b5c3d0;
    text-align: center;
}
.order_footer > :last-child { margin-bottom: 0; }
.order_flow {
    margin: 20px 0;
    list-style: none;
    text-align: center;
}
.order_flow li {
    display: inline-block;
    margin-right: 2px;
    color: #a3a3a3;
    font-size: 15px;
    font-weight: bold;
}
.order_flow li:last-child { margin-right: 0; }
.order_flow .is-current {
    display: inline-block;
    margin-right: 2px;
    padding: 5px 10px;
    background: #1b5fa6;
    color: #fff;
    font-size: 15px;
    font-weight: bold;
}
.order_flow li .order_flow_num {
    display: inline-block;
    width: 1.7em;
    height: 1.7em;
    margin-right: 7px;
    background: #a3a3a3;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    color: #fff;
    font-size: 13px;
    font-weight: normal;
    line-height: 1.7em;
}
.order_flow .is-current .order_flow_num {
    background: #fff;
    color: #1b5fa6;
    font-weight: bold;
}
.document {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
    padding: 12px 15px;
    background: #fff;
    line-height: 1.6;
}
.document:focus {
    outline: none;
    border: 1px solid #ddd;
}
.document { height: 300px; }
.privacy { margin: 0 0 20px; }
.privacy_ttl {
    margin-bottom: 5px;
    padding: 5px;
    background-color: #deeef4;
    font-size: 16px;
    font-weight: bold;
}
.agree {
    margin: 30px 0;
    padding: 12px 15px;
    background-color: #f7f7f7;
    border: 1px solid #ccc;
}
.privacy_body { padding: 0 0 20px; }

/* ----------------------------------------------------------
     分岐ボタン / .application-btn
------------------------------------------------------------- */
.application-area {
    width: 740px;
    margin: 30px auto 0;
}
.application-btn_server {
    position: relative;
    display: block;
    width: 605px;
    margin: 0 auto 30px;
    padding: 36px 36px 36px 95px;
    background: url(../img/order_server_icon.png) no-repeat 38px center #fff;
    border: 2px solid #e67715;
    color: #e67715;
    font-size: 28px;
    font-weight: bold;
    text-align: center;
    text-decoration: none!important;
}
.application-btn_server:hover {
    background: url(../img/order_server_icon.png) no-repeat 38px center #e67715;
    color: #fff;
}
.application-btn_server span { font-size: 20px; }
.application-btn_server i {
    position: absolute;
    top: 38px;
    right: 30px;
    font-size: 38px;
}
.application-domain-area { margin-bottom: 30px; }
.application-btn_domain {
    position: relative;
    float: left;
    display: block;
    width: 316px;
    padding: 22px;
    background: url(../img/order_domain_icon.png) no-repeat 22px center #fff;
    border: 2px solid #1b5fa6;
    color: #1b5fa6;
    font-size: 17px;
    font-weight: bold;
    text-align: center;
    text-decoration: none!important;
}
.application-btn_domain:hover {
    background: url(../img/order_domain_icon.png) no-repeat 22px center #1b5fa6;
    color: #fff;
}
.application-btn_domain i {
    position: absolute;
    top: 22px;
    right: 20px;
    font-size: 26px;
}
.application-btn_domain-transfer {
    position: relative;
    float: right;
    display: block;
    width: 316px;
    padding: 22px;
    background: url(../img/order_transfer_icon.png) no-repeat 22px center #fff;
    border: 2px solid #1b5fa6;
    color: #1b5fa6;
    font-size: 17px;
    font-weight: bold;
    text-align: center;
    text-decoration: none!important;
}
.application-btn_domain-transfer:hover {
    background: url(../img/order_transfer_icon.png) no-repeat 22px center #1b5fa6;
    color: #fff;
}
.application-btn_domain-transfer i {
    position: absolute;
    top: 22px;
    right: 20px;
    font-size: 26px;
}

.btn_new {
    background-color: #2466ab;
    color: #fff;
    border: 2px solid #194d83;
    border-radius: 5px;
    font-weight: bold;
}
.btn_login {
    background-color: #29517c;
    color: #fff;
    border: 2px solid #223e5d;
    border-radius: 5px;
    font-weight: bold;
}

.btn_new:hover {
    background-color: #2b7abc;
    color: #fff;
}
.btn_login:hover {
    background-color: #316195;
    color: #fff;
}

/* ----------------------------------------------------------
    フォームボタン(ie8対策)
------------------------------------------------------------- */
.ie8 .btn_xinfo_zip {
	width: 162px;
	height: 36px;
	margin-top: 5px;
	overflow: hidden;
	background: transparent url(../img/common/labels.png?date=190411) no-repeat;
	background-position: 0 -340px;
	text-indent: 110%;
	white-space: nowrap;
}
.ie8 .order_body_btn .btn {
	display: inline-block;
	overflow: hidden;
	background: transparent url(../img/common/labels.png?date=190411) no-repeat;
	vertical-align: middle;
	text-indent: 110%;
	white-space: nowrap;
}
.ie8 .order_body_btn .btn_xinfo_input {
	width: 217px;
	height: 63px;
	padding: 0;
	background-position: 0 -60px;
}
.ie8 .order_body_btn .btn_xinfo_conf {
	width: 175px;
	height: 63px;
	padding: 0;
	background-position: 0 -200px;
}
.ie8 .order_body_btn .btn_xinfo_rivision {
	width: 175px;
	height: 63px;
	padding: 0;
	background-position: 0 -270px;
}

/* ----------------------------------------------------------
    サイトシール / .ssl
------------------------------------------------------------- */
.ssl {
    width: 500px;
    margin: 0 auto;
}
.ssl_siteseal {
    width: 115px;
    height: 82px;
}

.ssl .media_body { 
    overflow: hidden;
    padding-top: 20px;
}

/* ----------------------------------------------------------
    フォームテーブル / .form-table 
------------------------------------------------------------- */
.form-table { margin-bottom: 15px; }
.form-table td { background-color: #fff; }
.form-table_name {
    float: left;
    display: block;
    width: 81%;
}
.form-table_icon {
    float: right;
    display: block;
    padding: 3px 4px;
    background-color: #222;
    color: #fff;
    font-size: 80%;
}
.no-js .form-table_icon_js { display: none !important; }
.form-table_icon_no-js { display: none !important; }
.no-js .form-table_icon_no-js { display: block !important; }
.form-table_required th .form-table_icon {
    float: right;
    display: block;
    padding: 3px 4px;
    background-color: #fa3636;
    color: #fff;
    font-size: 80%;
}
.form-table_required.is-success th .form-table_icon {
    float: right;
    padding: 2px 3px;
    background: #fff !important;
    border: 1px solid #2ecc71 !important;
    color: #2ecc71 !important;
    font-size: 80%;
    font-weight: bold;
}
.form-table_required.is-success th {
    background: #dff2e7 !important;
    color: #222 !important;
}
.form-table_required th {
    background: #ffdfdf !important;
    color: #fa3636 !important;
}
.ie8 .form-table_required th { width: 25%; }
.form-table input.is-success {
    background: #dff2e7;
    border: 1px solid #2ecc71;
}
.form-table select.is-success {
    background: #fff;
    border: 1px solid #ddd;
}
.form_message_list .success {
    padding: 0 0 0 18px;
    background: url(../img/common/ico_ok.png) 0 .3em no-repeat;
    color: #2ecc71;
}
.form-table .is-error {
    background: #ffdfdf;
    border: 1px solid #fa3636;
}
.form-table select.is-error {
    background: #fff;
    border: 1px solid #ddd;
}
.form_message_list .error {
    padding: 0 0 0 18px;
    background: url(../img/common/ico_error.png) 5px .2em no-repeat;
    color: #fa3636;
}
.valid-icon { display: none; }
.is-success + .valid-icon {
    display: inline-block;
    width: 26px;
    height: 26px;
    background: url(../img/common/ico_ok.png) 50% 50% no-repeat;
    vertical-align: middle;
}
.form_message_list .wait {
    display: inline-block;
    width: 16px;
    height: 16px;
    overflow: hidden;
    background: url(../img/common/spinner.gif) 0 0 no-repeat;
    text-indent: 100%;
}

/* ----------------------------------------------------------
    フォーム系パーツ
------------------------------------------------------------- */
.i-username {
    width: 200px;
    margin: 5px;
}
.i-domain {
    width: 200px;
    margin: 5px;
}
.i-short { width: 150px; }
.i-middle { width: 300px; }
.i-long { width: 450px; }
.i-wrapper {
    display: inline-block;
    margin: 0 5px;
    padding: 10px 15px;
    background: #fff;
    border: 1px solid #ccc;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}
.i-wrapper input { margin-right: 5px; }
.i-wrapper.policy {
    background: #ffdfdf;
    border: 1px solid #fa3636;
}
.i-wrapper.is-error {
    background: #ffdfdf;
    border: 1px solid #fa3636;
}
.i-wrapper.is-selected {
    background: #dff2e7!important;
    border: 1px solid #2ecc71;
}
.form-table input[type=radio].is-success  {
    background: none;
    border: none;
}
.no-js .i-wrapper.policy {
    background: #fff;
    border: 1px solid #ccc;
}
.no-js .btn_xinfo_zip { display: none; }
.btn_xinfo_input.is-disabled {
    cursor: default;
    opacity: .3;
	filter: alpha(opacity=30);
}

/* ----------------------------------------------------------
    170201キャンペーン追加：A/Bテスト用
------------------------------------------------------------- */
.xs_campaign-banner {
	display: none;
}
#form_campaign-banner {
	width: 550px;
    margin: 0 auto 30px;
    border: 1px solid #f7931e;
	position: relative;
}
.form_campaign-banner_header {
	    background: #f7931e;
}
#form_campaign-banner h3 {
    color: white;
    padding: 12px;
    margin-left: 60px;
    font-size: 15px;
}
.campaign-date {
	background: #ffce0a;
	font-size: 11px;
	padding: 5px;
	color: #333;
}
.form_campaign-banner_info p {
	font-size: 12px;
	padding: 7px;
	margin: 0 0 0 53px;
}
.form_campaign-banner_info p span {
	font-size: 11px;
}

.campaign-medal {
	position: absolute;
	top: 5px;
	left: 3px;
}


/* =================================================================


    スマートフォン想定(0px-767px)


================================================================== */
@media only screen and (min-width: 0) and (max-width: 767px) {
    body { padding: 10px 0; }
    
    /* ----------------------------------------------------------
        [SP] ボタンなどテキストの画像化 / .label
    ------------------------------------------------------------- */
    .btn_xinfo_search_submit,  .btn_xinfo_input,  .btn_xinfo_conf , .btn_xinfo_sms {
        padding: 18px;
        background: #f7790b;/* Old Browsers */
        background: -moz-linear-gradient(top, #f9a155 0, #f88724 50%, #f7790b 51%, #f7790b 100%); /* FF3.6+ */
        background: -webkit-gradient(left top, left bottom, color-stop(0%, #f88724), color-stop(50%, #f88724), color-stop(51%, #f7790b), color-stop(100%, #f7790b));/* Chrome, Safari4+ */
        background: -webkit-linear-gradient(top, #f9a155 0, #f88724 50%, #f7790b 51%, #f7790b 100%); /* Chrome10+,Safari5.1+ */
        background: -o-linear-gradient(top, #f9a155 0, #f88724 50%, #f7790b 51%, #f7790b 100%); /* Opera 11.10+ */
        background: -ms-linear-gradient(top, #f9a155 0, #f88724 50%, #f7790b 51%, #f7790b 100%); /* IE 10+ */
        background: linear-gradient(to bottom, #f9a155 0, #f88724 50%, #f7790b 51%, #f7790b 100%);/* W3C */
        border-radius: 3px;
        color: #fff !important;
        font-size: 18px;
        font-weight: bold;
        text-shadow: 0 -1px 0 #d67227;
        -webkit-box-shadow: inset 0 0 0 1px #f7790b, inset 0 0 0 2px #fff, 0 1px 3px rgba(0,0,0,.3);
        -moz-box-shadow: inset 0 0 0 1px #f7790b, inset 0 0 0 2px #fff, 0 1px 3px rgba(0,0,0,.3);
        box-shadow: inset 0 0 0 1px #f7790b, inset 0 0 0 2px #fff, 0 1px 3px rgba(0,0,0,.3);
        filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#f88724', endColorstr='#f7790b', GradientType=0 );/* IE6-9 */
    }
    .btn_xinfo_rivision {
        padding: 18px;
        background: #939393;/* Old Browsers */
        background: -moz-linear-gradient(top, #b1b1b1 0, #a0a0a0 50%, #939393 51%, #939393 100%); /* FF3.6+ */
        background: -webkit-gradient(left top, left bottom, color-stop(0%, #b1b1b1), color-stop(50%, #a0a0a0), color-stop(51%, #adadad), color-stop(100%, #939393));/* Chrome, Safari4+ */
        background: -webkit-linear-gradient(top, #b1b1b1 0, #a0a0a0 50%, #939393 51%, #939393 100%); /* Chrome10+,Safari5.1+ */
        background: -o-linear-gradient(top, #b1b1b1 0, #a0a0a0 50%, #939393 51%, #939393 100%); /* Opera 11.10+ */
        background: -ms-linear-gradient(top, #b1b1b1 0, #a0a0a0 50%, #939393 51%, #939393 100%); /* IE 10+ */
        background: linear-gradient(to bottom, #b1b1b1 0, #a0a0a0 50%, #939393 51%, #939393 100%);/* W3C */
        border-radius: 3px;
        color: #fff !important;
        font-size: 16px;
        font-weight: bold;
        text-shadow: 0 -1px 0 #666;
        -webkit-box-shadow: inset 0 0 0 1px #939393, inset 0 0 0 2px #fff, 0 1px 3px rgba(0,0,0,.3);
        -moz-box-shadow: inset 0 0 0 1px #939393, inset 0 0 0 2px #fff, 0 1px 3px rgba(0,0,0,.3);
        box-shadow: inset 0 0 0 1px #939393, inset 0 0 0 2px #fff, 0 1px 3px rgba(0,0,0,.3);
        filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#939393', endColorstr='#939393', GradientType=0 );/* IE6-9 */
        }
        .btn_xinfo_zip {
        padding: 8px 12px;
        background: #e2e2e2;/* Old Browsers */
        background: -moz-linear-gradient(top, #f5f5f5 0, #f5f5f5 50%, #e2e2e2 51%, #e2e2e2 100%); /* FF3.6+ */
        background: -webkit-gradient(left top, left bottom, color-stop(0%, #f5f5f5), color-stop(50%, #f5f5f5), color-stop(51%, #e2e2e2), color-stop(100%, #e2e2e2));/* Chrome, Safari4+ */
        background: -webkit-linear-gradient(top, #f5f5f5 0, #f5f5f5 50%, #e2e2e2 51%, #e2e2e2 100%); /* Chrome10+,Safari5.1+ */
        background: -o-linear-gradient(top, #f5f5f5 0, #f5f5f5 50%, #e2e2e2 51%, #e2e2e2 100%); /* Opera 11.10+ */
        background: -ms-linear-gradient(top, #f5f5f5 0, #f5f5f5 50%, #e2e2e2 51%, #e2e2e2 100%); /* IE 10+ */
        background: linear-gradient(to bottom, #f5f5f5 0, #f5f5f5 50%, #e2e2e2 51%, #e2e2e2 100%);/* W3C */
        border-radius: 3px;
        color: #222 !important;
        text-shadow: 0 1px 0 #fff;
        -webkit-box-shadow: inset 1px 1px 0 0 rgba(0,0,0,0.05), 0 1px 1px rgba(0,0,0,.3);
        -moz-box-shadow: inset 1px 1px 0 0 rgba(0,0,0,0.05), 0 1px 1px rgba(0,0,0,.3);
        box-shadow: inset 1px 1px 0 0 rgba(0,0,0,0.05), 0 1px 1px rgba(0,0,0,.3);
        filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#f5f5f5', endColorstr='#e2e2e2', GradientType=0 );/* IE6-9 */
    }
    
    /* ----------------------------------------------------------
        [SP] 分岐ボタン / .branch
    ------------------------------------------------------------- */
    .branch { margin-bottom: 10px; }
    
    .order_logo-txt {
        margin-left: 5px;
        font-weight: bold;
        font-size: 14px;
    }
    
    .branch_new-ttl ,.branch_login-ttl {
        padding: 15px 0;
        font-size: 16px;
    }
    .branch_new-ttl > span ,
    .branch_login-ttl > span { font-size: 20px; }
    
    .btn_new , .btn_login {
        display: inline-block;
        line-height: 1.5;
        text-decoration: none!important;
        padding: 10px;
        font-size: 18px;
    }
    
    .branch_btn .ico_chevron-right { display: none; }

    .order_msg { margin: 0 10px 20px 10px; }
    
    /* ----------------------------------------------------------
        [SP] 申し込み / .order
    ------------------------------------------------------------- */
    .order_header { padding: 10px 10px 0; }
    .order_logo { margin-bottom: 10px; }
    .order_logo img {
        width: 105px;
        height: 20px;
    }
    .order_ttl { padding: 10px; }
    .order_body { padding: 0 10px; }
    .order_flow {
        margin: 0 0 10px;
        list-style: none;
        text-align: center;
    }
    .order_flow li {
        display: inline-block;
        margin-right: 2px;
        padding-bottom: 5px;
        color: #a3a3a3;
        font-size: 13px;
        font-weight: bold;
    }
    .order_flow li:last-child { margin-right: 0; }
    .order_flow .is-current {
        display: inline-block;
        margin-right: 2px;
        padding: 3px 5px;
        background: #1b5fa6;
        color: #fff;
        font-size: 13px;
        font-weight: bold;
    }
    .order_flow li span {
        display: inline-block;
        width: 1.4em;
        height: 1.4em;
        margin-right: 5px;
        background: #a3a3a3;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        border-radius: 50%;
        color: #fff;
        font-size: 11px;
        font-weight: normal;
        line-height: 1.4em;
    }
    .order_flow .is-current span {
        background: #fff;
        color: #1b5fa6;
        font-weight: bold;
    }
    .document { height: 200px; }
    .rule {
        float: none;
        width: 100%;
        margin-bottom: 20px;
    }
    .rule:last-child { margin-bottom: 0; }
    
    /* ----------------------------------------------------------
        [SP] 分岐ボタン / .application-btn
    ------------------------------------------------------------- */
    .application-area {
        width: 94%;
        margin: 20px auto 0;
    }
    .application-btn_server {
        position: relative;
        display: block;
        width: auto!important;
        margin: 0 auto 20px;
        padding: 70px 0 20px 0;
        background: url(../img/order_server_icon.png) no-repeat center 15px #fff;
        border: 2px solid #e67715;
        color: #e67715;
        font-size: 18px;
        font-weight: bold;
        line-height: 1;
        text-align: center;
        text-decoration: none!important;
    }
    .application-btn_server:hover {
        background: url(../img/order_server_icon.png) no-repeat center 15px #e67715;
        color: #fff;
    }
    .application-btn_server span {
        display: block;
        margin-top: 5px;
        font-size: 14px;
    }
    .application-btn_server i {
        position: absolute;
        top: inherit;
        bottom: 3px;
        right: 3px;
        font-size: 20px;
        transform: rotate(45deg);
    }
    .application-domain-area { margin-bottom: 20px; }
    .application-btn_domain {
        position: relative;
        float: left;
        display: block;
        width: 40%;
        padding: 60px 10px 10px 10px;
        background: url(../img/order_domain_icon.png) no-repeat center 10px #fff;
        border: 2px solid #1b5fa6;
        color: #1b5fa6;
        font-size: 13px;
        font-weight: bold;
        text-align: center;
        text-decoration: none!important;
    }
    .application-btn_domain:hover {
        background: url(../img/order_domain_icon.png) no-repeat center 10px #1b5fa6;
        color: #fff;
    }
    .application-btn_domain i, .application-btn_domain-transfer i {
        position: absolute;
        top: inherit!important;
        bottom: 0;
        right: 0!important;
        font-size: 14px;
        transform: rotate(45deg);
    }
    .application-btn_domain-transfer {
        position: relative;
        float: right;
        display: block;
        width: 40%;
        padding: 60px 10px 10px 10px;
        background: url(../img/order_transfer_icon.png) no-repeat center 10px #fff;
        border: 2px solid #1b5fa6;
        color: #1b5fa6;
        font-size: 13px;
        font-weight: bold;
        text-align: center;
        text-decoration: none!important;
    }
    .application-btn_domain-transfer:hover {
        background: url(../img/order_transfer_icon.png) no-repeat center 10px #1b5fa6;
        color: #fff;
    }
    
    /* ----------------------------------------------------------
        [SP] サイトシール / .ssl
    ------------------------------------------------------------- */
    .ssl { width: auto; }
    .ssl_siteseal { width: auto; }
    .ssl .media_body { padding-top: 0; }
    
    /* ----------------------------------------------------------
        [SP] フォームテーブル / .form-table
    ------------------------------------------------------------- */
    .form-table th {
        position: relative;
        width: 100%;
    }
    .form-table input { margin-bottom: 5px; }
    .form-table_co { border-bottom: 1px solid #ccc; }
    .form-table_name {
        float: none;
        display: inline-block;
        width: 75%;
    }
    .form-table_icon {
        position: absolute;
        right: 10px;
        float: none;
        display: inline;
        padding: 3px 4px;
        background-color: #222;
        color: #fff;
        font-size: 80%;
    }
    .form-table_required th .form-table_icon {
        position: absolute;
        right: 10px;
        float: none;
        display: inline;
        padding: 3px 4px;
        background-color: #fa3636!important;
        color: #fff;
        font-size: 80%;
    }
    
    /* ----------------------------------------------------------
        [SP] フォーム系パーツ
    ------------------------------------------------------------- */
    .i-short { width: 150px; }
    .i-middle { width: 200px; }
    .i-long { width: 200px; }
    
    .i-wrapper { margin: 3px; }
	
	
	 /* ----------------------------------------------------------
       170207 [SP] ABテスト用
    ------------------------------------------------------------- */
	#form_campaign-banner {
		width: 90%;
		margin-bottom: 20px;
	}
	.dt_campaign-banner {
		display: none;
	}
	.xs_campaign-banner {
		display: block;
		max-width: 90%;
		margin: 0 auto;
	}
	.campaign-date {
		display: block;
		padding: 2px 3px;
		margin-top: 5px;
		text-align: center;
	}
	.form_campaign-banner_info p {
		margin: 0;
		text-align: center;
	}
	#form_campaign-banner h3 {
		margin-left: 0;
		text-align: center;
	}
	.campaign-medal {
		top: -15px;
		left: -13px;
	}
	
}

/* =================================================================


    タブレット想定(768px-969px)


================================================================== */
@media only screen and (min-width: 768px) and (max-width: 969px) {
    body { padding: 20px 0; }
    
    /* ----------------------------------------------------------
        [Tablet] ボタンなどテキストの画像化 / .label
    ------------------------------------------------------------- */
    .btn_xinfo_search_submit,  .btn_xinfo_input,  .btn_xinfo_conf , .btn_xinfo_sms {
        padding: 18px;
        background: #f7790b;/* Old Browsers */
        background: -moz-linear-gradient(top, #f9a155 0, #f88724 50%, #f7790b 51%, #f7790b 100%); /* FF3.6+ */
        background: -webkit-gradient(left top, left bottom, color-stop(0%, #f88724), color-stop(50%, #f88724), color-stop(51%, #f7790b), color-stop(100%, #f7790b));/* Chrome, Safari4+ */
        background: -webkit-linear-gradient(top, #f9a155 0, #f88724 50%, #f7790b 51%, #f7790b 100%); /* Chrome10+,Safari5.1+ */
        background: -o-linear-gradient(top, #f9a155 0, #f88724 50%, #f7790b 51%, #f7790b 100%); /* Opera 11.10+ */
        background: -ms-linear-gradient(top, #f9a155 0, #f88724 50%, #f7790b 51%, #f7790b 100%); /* IE 10+ */
        background: linear-gradient(to bottom, #f9a155 0, #f88724 50%, #f7790b 51%, #f7790b 100%);/* W3C */
        border-radius: 3px;
        color: #fff !important;
        font-size: 18px;
        font-weight: bold;
        text-shadow: 0 -1px 0 #d67227;
        -webkit-box-shadow: inset 0 0 0 1px #f7790b, inset 0 0 0 2px #fff, 0 1px 3px rgba(0,0,0,.3);
        -moz-box-shadow: inset 0 0 0 1px #f7790b, inset 0 0 0 2px #fff, 0 1px 3px rgba(0,0,0,.3);
        box-shadow: inset 0 0 0 1px #f7790b, inset 0 0 0 2px #fff, 0 1px 3px rgba(0,0,0,.3);
     filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#f88724', endColorstr='#f7790b', GradientType=0 );/* IE6-9 */
    }
    .btn_xinfo_rivision {
        padding: 18px;
        background: #939393;/* Old Browsers */
        background: -moz-linear-gradient(top, #b1b1b1 0, #a0a0a0 50%, #939393 51%, #939393 100%); /* FF3.6+ */
        background: -webkit-gradient(left top, left bottom, color-stop(0%, #b1b1b1), color-stop(50%, #a0a0a0), color-stop(51%, #adadad), color-stop(100%, #939393));/* Chrome, Safari4+ */
        background: -webkit-linear-gradient(top, #b1b1b1 0, #a0a0a0 50%, #939393 51%, #939393 100%); /* Chrome10+,Safari5.1+ */
        background: -o-linear-gradient(top, #b1b1b1 0, #a0a0a0 50%, #939393 51%, #939393 100%); /* Opera 11.10+ */
        background: -ms-linear-gradient(top, #b1b1b1 0, #a0a0a0 50%, #939393 51%, #939393 100%); /* IE 10+ */
        background: linear-gradient(to bottom, #b1b1b1 0, #a0a0a0 50%, #939393 51%, #939393 100%);/* W3C */
        border-radius: 3px;
        color: #fff !important;
        font-size: 18px;
        font-weight: bold;
        text-shadow: 0 -1px 0 #666;
        -webkit-box-shadow: inset 0 0 0 1px #939393, inset 0 0 0 2px #fff, 0 1px 3px rgba(0,0,0,.3);
        -moz-box-shadow: inset 0 0 0 1px #939393, inset 0 0 0 2px #fff, 0 1px 3px rgba(0,0,0,.3);
        box-shadow: inset 0 0 0 1px #939393, inset 0 0 0 2px #fff, 0 1px 3px rgba(0,0,0,.3);
     filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#939393', endColorstr='#939393', GradientType=0 );/* IE6-9 */
    }
    .btn_xinfo_zip {
        padding: 8px 12px;
        background: #e2e2e2;/* Old Browsers */
        background: -moz-linear-gradient(top, #f5f5f5 0, #f5f5f5 50%, #e2e2e2 51%, #e2e2e2 100%); /* FF3.6+ */
        background: -webkit-gradient(left top, left bottom, color-stop(0%, #f5f5f5), color-stop(50%, #f5f5f5), color-stop(51%, #e2e2e2), color-stop(100%, #e2e2e2));/* Chrome, Safari4+ */
        background: -webkit-linear-gradient(top, #f5f5f5 0, #f5f5f5 50%, #e2e2e2 51%, #e2e2e2 100%); /* Chrome10+,Safari5.1+ */
        background: -o-linear-gradient(top, #f5f5f5 0, #f5f5f5 50%, #e2e2e2 51%, #e2e2e2 100%); /* Opera 11.10+ */
        background: -ms-linear-gradient(top, #f5f5f5 0, #f5f5f5 50%, #e2e2e2 51%, #e2e2e2 100%); /* IE 10+ */
        background: linear-gradient(to bottom, #f5f5f5 0, #f5f5f5 50%, #e2e2e2 51%, #e2e2e2 100%);/* W3C */
        border-radius: 3px;
        color: #222 !important;
        text-shadow: 0 1px 0 #fff;
        -webkit-box-shadow: inset 1px 1px 0 0 rgba(0,0,0,0.05), 0 1px 1px rgba(0,0,0,.3);
        -moz-box-shadow: inset 1px 1px 0 0 rgba(0,0,0,0.05), 0 1px 1px rgba(0,0,0,.3);
        box-shadow: inset 1px 1px 0 0 rgba(0,0,0,0.05), 0 1px 1px rgba(0,0,0,.3);
     filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#f5f5f5', endColorstr='#e2e2e2', GradientType=0 );/* IE6-9 */
    }
    
    /* ----------------------------------------------------------
        [Tablet] 分岐ボタン / .branch
    ------------------------------------------------------------- */
    .branch { margin-bottom: 10px; }
    
    .order_logo-txt {
        margin-left: 10px;
        font-weight: bold;
        font-size: 18px;
    }
    .branch_new-ttl ,.branch_login-ttl {
        padding: 20px 0;
        font-size: 16px;
    }
    .branch_new-ttl > span ,
    .branch_login-ttl > span { font-size: 20px; }
    
    .btn_new , .btn_login {
        padding: 15px;
        display: inline-block;
        line-height: 1.5;
        text-decoration: none!important;
        font-size: 20px;
    }
    
    .branch_btn .ico_chevron-right { display: none; }

    .order_msg { margin: 0 10px 20px 10px; }
    
    /* ----------------------------------------------------------
        [Tablet] 分岐ボタン / .application-btn
    ------------------------------------------------------------- */
    .application-area {
        width: 94%;
        margin: 20px auto 0;
    }
    .application-btn_server {
        position: relative;
        display: block;
        width: auto!important;
        margin: 0 auto 20px;
        padding: 70px 0 20px 0;
        background: url(../img/order_server_icon.png) no-repeat center 15px #fff;
        border: 2px solid #e67715;
        color: #e67715;
        font-size: 18px;
        font-weight: bold;
        line-height: 1;
        text-align: center;
        text-decoration: none!important;
    }
    .application-btn_server:hover {
        background: url(../img/order_server_icon.png) no-repeat center 15px #e67715;
        color: #fff;
    }
    .application-btn_server span {
        display: block;
        margin-top: 5px;
        font-size: 14px;
    }
    .application-btn_server i {
        position: absolute;
        top: inherit;
        bottom: 3px;
        right: 3px;
        font-size: 20px;
        transform: rotate(45deg);
    }
    .application-domain-area { margin-bottom: 20px; }
    .application-btn_domain {
        position: relative;
        float: left;
        display: block;
        width: 45%;
        margin-right: 10px;
        padding: 60px 10px 10px 10px;
        background: url(../img/order_domain_icon.png) no-repeat center 10px #fff;
        border: 2px solid #1b5fa6;
        color: #1b5fa6;
        font-size: 13px;
        font-weight: bold;
        text-align: center;
        text-decoration: none!important;
    }
    .application-btn_domain:hover {
        background: url(../img/order_domain_icon.png) no-repeat center 10px #1b5fa6;
        color: #fff;
    }
    .application-btn_domain i, .application-btn_domain-transfer i {
        position: absolute;
        top: inherit!important;
        bottom: 0;
        right: 0!important;
        font-size: 14px;
        transform: rotate(45deg);
    }
    .application-btn_domain-transfer {
        position: relative;
        float: right;
        display: block;
        width: 45%;
        padding: 60px 10px 10px 10px;
        background: url(../img/order_transfer_icon.png) no-repeat center 10px #fff;
        border: 2px solid #1b5fa6;
        color: #1b5fa6;
        font-size: 13px;
        font-weight: bold;
        text-align: center;
        text-decoration: none!important;
    }
    .application-btn_domain-transfer:hover {
        background: url(../img/order_transfer_icon.png) no-repeat center 10px #1b5fa6;
        color: #fff;
    }
    
    /* ----------------------------------------------------------
         [Tablet] フォームテーブル / .form-table
    ------------------------------------------------------------- */
    .form-table th { width: 30%; }
    
    /* ----------------------------------------------------------
         [Tablet] フォーム系パーツ
    ------------------------------------------------------------- */
    .i-long { width: 400px; }


	 /* ----------------------------------------------------------
       170207 [Tablet] ABテスト用
    ------------------------------------------------------------- */
	.test-show {
	display: block!important;
}

}






/* =================================================================


    PC想定(970px-)


================================================================== */
@media only screen and (min-width: 970px) {
    /* ----------------------------------------------------------
        [PC] ボタンなどテキストの画像化 / .label
    ------------------------------------------------------------- */
    .label {
        display: inline-block;
        overflow: hidden;
        margin: 0;
        padding: 0;
        background: transparent url(../img/common/labels.png?date=190411) no-repeat;
        vertical-align: middle;
        text-indent: 110%;
        white-space: nowrap;
    }
    .label_ttl-xinfo {
        width: 266px;
        height: 15px;
    }
    .label_xinfo_btn_server-serarch {
        width: 89px;
        height: 20px;
        background-position: 0 -30px;
    }
    .label_xinfo_btn_zip {
        width: 118px;
        height: 12px;
        background-position: 0 -140px;
    }
    .label_xinfo_btn_back {
        width: 158px;
        height: 12px;
        background-position: 0 -171px;
    }
    .order_body_btn .btn {
        display: inline-block;
        overflow: hidden;
        background: transparent url(../img/common/labels.png?date=190411) no-repeat;
        vertical-align: middle;
        text-indent: 110%;
        white-space: nowrap;
    }
    .order_body_btn .btn_xinfo_input {
        width: 217px;
        height: 63px;
        padding: 0;
        background-position: 0 -60px;
    }
    .order_body_btn .btn_xinfo_conf {
        width: 175px;
        height: 63px;
        padding: 0;
        background-position: 0 -200px;
    }
    .order_body_btn .btn_xinfo_rivision {
        width: 175px;
        height: 63px;
        padding: 0;
        background-position: 0 -270px;
    }
    .order_body_btn .btn_xinfo_sms {
        width: 247px;
        height: 64px;
        padding: 0;
        background-position: 0 -470px;
    }
    .btn_xinfo_search_submit {
        width: 200px;
        height: 63px;
        overflow: hidden;
        background: transparent url(../img/common/labels.png?date=190411) no-repeat;
        background-position: 0 -390px;
        text-indent: 110%;
        white-space: nowrap;
    }
    .btn_xinfo_zip {
        width: 162px;
        height: 36px;
        overflow: hidden;
        background: transparent url(../img/common/labels.png?date=190411) no-repeat;
        background-position: 0 -340px;
        text-indent: 110%;
        white-space: nowrap;
    }
    
    /* ----------------------------------------------------------
        [PC] 申し込み / .order
    ------------------------------------------------------------- */
    .order_body { padding: 0 50px; }
    
    /* ----------------------------------------------------------
        [PC] フォームテーブル / .form-table
    ------------------------------------------------------------- */
    .form-table th { width: 25%; }
    
    /* ----------------------------------------------------------
        [PC] フォーム系余白
    ------------------------------------------------------------- */
    .mr_name { margin-right: 10px; }
    
    /* ----------------------------------------------------------
        [PC] 分岐ボタン / .branch
    ------------------------------------------------------------- */
    .branch {
        width: 406px;
    }
    
    .branch_left { float: left; }
    .branch_right { float: right; }
    
    .order_ttl { margin-bottom: 30px; }
    .order_logo-txt {
        margin-left: 10px;
        font-weight: bold;
        font-size: 18px;
    }
    .branch_new-ttl ,.branch_login-ttl {
        padding: 20px 0;
        font-size: 16px;
    }
    .branch_new-ttl > span ,
    .branch_login-ttl > span { font-size: 22px; }
    .btn_new {
        position: relative;
        padding-top: 28px;
        height: 77px;
        display: block;
        line-height: 1.2;
        text-decoration: none!important;
        font-size: 20px;
    }
    .btn_login {
        position: relative;
        height: 105px;
        display: block;
        line-height: 105px;
        text-decoration: none!important;
        font-size: 20px;
    }
    
    .branch_btn .ico_chevron-right {
        position: absolute;
        right: 25px;
        top: 43px;
    }
    
    .branch_btn .btn { width: 368px; }
    
    .label_order-blanch { background: transparent url(../img/common/labels.png?date=190411) no-repeat; }
    
    .label_order-blanch_ttl_beginner{
        width: 333px;
        height: 20px;
        background-position: 0 -466px;
    }
    .label_order-blanch_ttl_user{
        width: 350px;
        height: 20px;
        background-position: 0 -496px;
    }
    .label_order-blanch_btn_order{
        width: 162px;
        height: 23px;
        margin: 10px 0;
        background-position: 0 -527px;
    }
    .label_order-blanch_btn_login{
        width: 100px;
        height: 23px;
        margin: 10px 0;
        background-position: 0 -557px;
    }
	
}