.signup-success-notice {
    margin: 0 0 1.25em;
    padding: 0.95em 1.1em;
    border: 0.125em solid #a7d7a6;
    border-radius: 0.75em;
    background: #eef9ee;
    color: #236a2c;
    font-weight: 700;
    line-height: 1.6;
}

.signup-warning-notice {
    margin: 0 0 1.25em;
    padding: 0.95em 1.1em;
    border: 0.125em solid #f3c26b;
    border-radius: 0.75em;
    background: #fff7e8;
    color: #9a5b00;
    font-weight: 700;
    line-height: 1.6;
}

.signup-help-text {
    margin: 0 0 1.25em;
    font-size: 0.95em;
    line-height: 1.6;
}

.signup-help-text.is-success {
    color: #236a2c;
    font-weight: 700;
}

.signup-help-text.is-error {
    color: #b42318;
    font-weight: 700;
}

.signup-thanks-form {
    border-top: 0;
}

.signup-primary-action {
    margin-bottom: 1em;
}

.signup-select-group {
    margin: 0 0 1em;
}

.signup-selectbox {
    width: 100%;
}

.signup-selectbox select {
    width: 100%;
}

.signup-note {
    margin: -0.25em 0 1em;
    font-size: 0.9em;
    line-height: 1.6;
    color: var(--gray03);
}

.signup-once-row {
    display: flex;
    align-items: center;
    gap: 0.5em;
}

.signup-once-row .signup-selectbox {
    flex: 1 1 auto;
    min-width: 0;
}

.signup-once-suffix {
    flex: 0 0 auto;
    font-size: 0.95em;
    color: var(--black);
    white-space: nowrap;
}

@media screen and (max-width: 767px) {
    .signup-once-row {
        gap: 0.4em;
    }

    .signup-once-suffix {
        font-size: 0.88em;
    }
}


.install-guide {
	width: min(100% - (var(--padding) * 2), 736px);
	margin: 6.6em auto 0;
	padding: 1.1em 1.1em;
	border: 0;
	border-radius: 1em;
	background: var(--white);
	box-sizing: border-box;
}

.install-guide[hidden],
.install-guide .install-guide-panel[hidden] {
	display: none !important;
}

.install-guide-head {
	display: flex;
	align-items: center;
	gap: 0.6em;
	margin: 0 0 0.75em;
	background: var(--orange);
	color: #fff;
	padding: 0.5em 1em;
	border-radius: 1em;
}

.install-guide-icon {
	width: auto;
	height: auto;
	border-radius: 0;
	background: transparent;
	color: #fff;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 1.35em;
	line-height: 1;
	flex: 0 0 auto;
}

.install-guide-title {
	margin: 0;
	font-size: 1.1em;
	font-weight: 700;
}

.install-guide-body {
	margin: 0;
	font-size: 0.95em;
	line-height: 1.8;
	color: #000;
}

.install-guide-body-strong {
	font-weight: 700;
}

.install-guide-steps {
	margin: 0.8em 0 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: 0.55em;
}

.install-guide-step {
	display: flex;
	align-items: flex-start;
	gap: 0.55em;
}

.install-guide-step-no {
	width: 1.7em;
	height: 1.7em;
	border-radius: 999px;
	background: var(--green);
	border: 0;
	color: var(--white);
	font-size: 0.9em;
	font-weight: 700;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	margin-top: 0.05em;
}

.install-guide-step-text {
	flex: 1 1 auto;
	min-width: 0;
	color: #000;
}

.install-guide-symbol {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.2em;
	height: 1.8em;
	padding: 0 0.45em;
	margin: 0 0.12em;
	border-radius: 0.55em;
	background: transparent;
	border: 0;
	font-weight: 700;
	color: var(--green);
	vertical-align: middle;
	box-sizing: border-box;
}

.install-guide-note {
	margin: 0.8em 0 0;
	font-size: 0.88em;
	line-height: 1.7;
	color: #000;
}

body.has-install-guide #start-options {
	margin-top: 1em;
}


.install-guide-share-icon {
	display: inline-block;
	width: 1.15em;
	height: 1.15em;
	margin: 0 0.12em;
	vertical-align: -0.18em;
	background: var(--green);
	-webkit-mask: url('/images/common/share.svg') center / contain no-repeat;
	mask: url('/images/common/share.svg') center / contain no-repeat;
}

body.is-install-guide-only #start-options,
body.is-install-guide-only #content .tabs,
body.is-install-guide-only #content .tab-content-area {
	display: none !important;
}

@media all and (max-width: 736px) {
	.install-guide {
	width: min(100% - (var(--padding) * 2), 736px);
	margin: 6.6em auto 0;
	padding: 1.1em 1.1em;
	border: 0;
	border-radius: 1em;
	background: var(--white);
	box-sizing: border-box;
}
