﻿@charset "UTF-8";
*,*:before,*:after {
box-sizing: border-box;

}



/* ----全体設定---- */
body {
margin: 0;
font-family: -apple-system, BlinkMacSystemFont, "游ゴシック体", YuGothic, "Yu Gothic M", "游ゴシック Medium", "Yu Gothic Medium", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN W3", HiraKakuProN-W3, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "Helvetica Neue", HelveticaNeue, Helvetica, Arial, "Segoe UI", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
font-size: 14px;
line-height: 1.5;
min-width: 320px;
color: #444;
background-color: #fff;

}

body.fixed {
position: fixed;
width: 100%;
height: 100%;

}



/* ----ヘッドライン---- */
h1,.h1 {
padding: 20px 10px 20px 10px;
font-size: 18px;
font-weight: bold;
background-color: transparent;

}

h2 {
padding: 10px;
font-size: 17px;
font-weight: normal;
font-weight: bold;
background-color: inherit;

}

h2.after-border {
text-align: center;
line-height: 140%;
padding-bottom: 20px;
margin-bottom: 30px;
position: relative;
letter-spacing: 0.1em;

}

h2.after-border:after {
content: "";
display: block;
position: absolute;
bottom: 0;
left: 50%;
width: 2em;
margin-left: -1em;
height: 2px;
background-color: #444;

}

h2 span {
display: block;
font-size: 13px;
line-height: 110%;
letter-spacing: 0;
margin-top: 3px;

}

h2 a {
text-decoration: none;

}

h3 {
padding: 10px;
font-size: 15px;
font-weight: bold;

}



/* ----リンク---- */
a {
text-decoration: underline;
color: #444;

}

a:hover,a:focus {
text-decoration: none;

}

a:focus {
/*outline: 5px auto -webkit-focus-ring-color;
outline-offset: -2px;
*/

}



/* ----タグ---- */
img {
max-width: 100%;
vertical-align: bottom;

}

hr {
border: 0;
border-bottom: 1px dotted #ccc;

}

address {
font-style: normal;

}



/* ----padding margin---- */
.mt0 {
margin-top: 0 !important;

}

.mb0 {
margin-bottom: 0 !important;

}

.pt0 {
padding-top: 0 !important;

}

.pb0 {
padding-bottom: 0 !important;

}



/* ----input---- */
input[type="radio"],input[type="checkbox"] {
display: none;

}

label > input[type="radio"],label > input[type="checkbox"] {
display: inline-block;

}

input[type="radio"] + label,input[type="checkbox"] + label {
padding-left: 30px;
position: relative;
display: inline-block;
margin-right: 30px;
line-height: 18px;
-webkit-transition: all .4s ease;
-moz-transition: all .4s ease;
transition: all .4s ease
}

input[type="radio"] + label::before,input[type="checkbox"] + label::before {
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
width: 18px;
height: 18px;
border: 1px solid #999;

}

input[type="radio"] + label::before {
border-radius: 50%;

}

input[type="radio"] + label::after {
content: "";
display: block;
position: absolute;
top: 4px;
left: 4px;
width: 10px;
height: 10px;
border-radius: 50%;
opacity: 0;
-webkit-transition: all .4s ease;
-moz-transition: all .4s ease;
transition: all .4s ease
}

input[type="checkbox"] + label::after {
content: "";
display: block;
position: absolute;
top: 2px;
left: 2px;
width: 18px;
height: 8px;
opacity: 0;
-webkit-transition: all .4s ease;
-moz-transition: all .4s ease;
transition: all .4s ease;
transform: rotate(-40deg);
-webkit-transform: rotate(-40deg);
-moz-transform: rotate(-40deg);

}

input[type="radio"]:checked + label {


}

input[type="radio"]:checked + label::after,input[type="checkbox"]:checked + label::after {
opacity: 1;

}

#loginstatesaving {
visibility: hidden;
opacity: 0;
position: relative;
margin-right: 11px;
-webkit-transition: all .4s ease;
-moz-transition: all .4s ease;
transition: all .4s ease;

}

.block-order-estimate--login-state-saving label[for="loginstatesaving"]{
position: relative;

}

.block-order-estimate--login-state-saving label[for="loginstatesaving"].is-checked{
color: #ff8363;

}

.block-order-estimate--login-state-saving label[for="loginstatesaving"]::before{
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
width: 18px;
height: 18px;
border: 1px solid #999;
visibility: visible;
opacity: 1;
margin-right: 5px;

}

.block-order-estimate--login-state-saving #loginstatesaving:checked{
opacity: 1;

}

.block-order-estimate--login-state-saving #loginstatesaving:after{
content: "";
display: block;
position: absolute;
top: 2px;
left: 2px;
width: 18px;
height: 8px;
border-bottom: 2px #ff8363 solid;
border-left: 2px #ff8363 solid;
transform: rotate(-40deg);
-webkit-transform: rotate(-40deg);
-moz-transform: rotate(-40deg);
-webkit-transition: all .4s ease;
-moz-transition: all .4s ease;
transition: all .4s ease;

}

.block-order-estimate--login-state-saving #loginstatesaving:checked::after{
visibility: visible;

}

/*.block-order-estimate--login-state-saving.js-register-login-state-saving > label {
padding-left: 30px;
position: relative;
display: inline-block;
margin-right: 30px;
line-height: 18px;
-webkit-transition: all .4s ease;
-moz-transition: all .4s ease;
transition: all .4s ease
}

.block-order-estimate--login-state-saving.js-register-login-state-saving > label::before {
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
width: 18px;
height: 18px;
border: 1px solid #999;

}

.block-order-estimate--login-state-saving.js-register-login-state-saving > label::after {
content: "";
display: block;
position: absolute;
top: 2px;
left: 2px;
width: 18px;
height: 8px;
opacity: 0;
-webkit-transition: all .4s ease;
-moz-transition: all .4s ease;
transition: all .4s ease;
transform: rotate(-40deg);
-webkit-transform: rotate(-40deg);
-moz-transform: rotate(-40deg);

}

#loginstatesaving:checked {

}

#loginstatesaving:checked::after,#loginstatesaving:checked::after {
opacity: 1;

}

*/


/* ----入力フォーム共通---- */
input,button,select,textarea {
font-family: inherit;
font-size: inherit;
line-height: inherit;

}

input[type="submit"],input[type="button"],button {
    -webkit-appearance: none;
    border-radius: 0;

}

input[type="text"],input[type="tel"],input[type="email"],input[type="search"],input[type="password"],input[type="url"],input[type="number"] {
padding: 0 1em;
border: 1px solid #ccc;
background-color: #fff;
max-width: 100%;
height: 42px;
line-height: 42px;

}

select {
border: 1px solid #ccc;
background-color: #fff;
line-height: 40px;
height: 40px;
border-radius: 0;
-moz-border-radius: 0;
-webkit-border-radius: 0;

}

textarea {
padding: 12px;
border: 1px solid #ccc;
background-color: #fff;
max-width: 100%;

}

input[type="text"]:hover,input[type="tel"]:hover,input[type="email"]:hover,input[type="search"]:hover,input[type="password"]:hover,input[type="url"]:hover,input[type="number"]:hover,select:hover,textarea:hover {
border: 1px solid #666;

}

input[type="radio"] {
width: 18px;
height: 18px;
vertical-align: middle;
margin-right: 5px;

}

input[type="checkbox"] {
width: 18px;
height: 18px;
vertical-align: middle;
margin-right: 5px;

}

label.radio,label.checkbox,input[type="radio"],input[type="radio"] + label,input[type="checkbox"],input[type="checkbox"] + label,select {
cursor: pointer;

}

input[type="text"][disabled] {
background: #dcdcdc;
cursor: not-allowed;

}

input[type="radio"][disabled] + label,input[type="checkbox"][disabled] + label {

    opacity: 0.5;
    cursor: not-allowed;

/* 禁止カーソル */

}



/* ----ボタン---- */
.btn {
display: inline-block;
margin: 0;
text-align: center;
vertical-align: middle;
cursor: pointer;
white-space: nowrap;
padding: 8px 14px;
border: none;
text-decoration: none;

}

.btn:hover,.btn:focus {
text-decoration: none;

}

.btn:active,.btn.active {
outline: 0;
box-shadow: inset 2px 2px 2px rgba(0, 0, 0, 0.125);

}

.btn.disabled,.btn[disabled],.btn.disabled:hover,.btn[disabled]:hover,.btn.disabled:active,.btn[disabled]:active {
cursor: not-allowed;
opacity: 0.65;
filter: alpha(opacity=65);
box-shadow: none !important;

}

.btn-default {
color: #333;
background-color: #e5e5e5;

}

.btn-primary {
color: #fff;
background-color: #f60;

}

.btn-secondary {
color: #fff;
background-color: #666;

}

.btn-danger {
color: #fff;
background-color: #d9534f;

}

.hidden-btn {
position: absolute;
left: -9999px;
width: 1px;
height: 1px;

}

.input-group {
display: table;
width: 100%;

}

.input-group > span {
display: table-cell;
width: 100%;

}

.input-group-btn {
display: table-cell;
white-space: nowrap;

}



/* ----画面上部メッセージー---- */
.alert {
margin-top: 5px;
padding: 10px 10px 10px 30px;
margin-bottom: 5px;
position: relative;
border: 1px solid #ebccd1;
color: #a94442;
background-color: #f2dede;

}

.alert:before {
font-family: FontAwesome;
content: "\f071";
position: absolute;
left: 10px;

}

.success {
margin-top: 5px;
padding: 10px 10px 10px 30px;
margin-bottom: 5px;
position: relative;
border: 1px solid #bce8f1;
color: #31708f;
background-color: #d9edf7;

}

.success:before {
font-family: FontAwesome;
content: "\f05a";
position: absolute;
left: 10px;

}



/* ----入力フォームタイトル---- */
.legend {
font-size: 15px;
font-weight: bold;
width: 100%;
margin: 10px 0 15px 0;
padding: 5px 0;
border-bottom: 1px solid #c8c8c8;

}



/* ----縦型入力フォーム---- */
.fieldset-vertical {
margin-bottom: 10px;

}

.fieldset-vertical .form-group {
margin: 5px 0 15px 0;
position: relative;

}

.fieldset-vertical .form-group .required {
position: absolute;
top: 9px;
right: 11px;

}

.fieldset-vertical .form-label,.fieldset-vertical .constraint {
float: left;
margin: 0 0 10px 0;

}

.fieldset-vertical .form-label {
display: block;
width: 100%;
background: #f3f3f3;
padding: 10px 60px 10px 10px;

}

.fieldset-vertical .form-label label {
font-weight: bold;

}

.fieldset-vertical .form-control {
clear: both;

}



/* ----入力支援---- */
.form-error {
display: block;
color: #a94442;

}

.required:after {
display: inline;
padding: .2em .6em;
font-size: 11px;
text-align: center;
white-space: nowrap;
vertical-align: baseline;
border-radius: .25em;
color: #fff;
background-color: #d9534f;
content: "必須";

}

.help-block {
display: block;
margin-bottom: 10px;
color: #737373;

}

.count-msg-another {
display: block;
font-size: 11px;
margin-top: 5px;
color: #555;

}

.count-msg {
display: block;
font-size: 11px;
margin-top: 5px;
color: #f66;

}



/* ----入力フォームボタン---- */
.action-buttons {
width: auto;
display: block;

}

.action .btn {
width: 100%;
margin-top: 10px;
padding: 13px 0;
border-bottom-width: 2px;

}



/* ----ラジオボタン、チェックボックス---- */
.radio {
margin-right: 10px;

}

.checkbox {
margin-right: 10px;

}



/* ----EFO---- */
.efo-icon {
border: none;
vertical-align: middle;

}

input[type="text"].efo-error,input[type="tel"].efo-error,input[type="email"].efo-error,input[type="search"].efo-error,input[type="password"].efo-error,input[type="url"].efo-error,input[type="number"].efo-error,select.efo-error,textarea.efo-error {
background-color: #f2dede;

}

input[type="text"].efo-valid,input[type="tel"].efo-valid,input[type="email"].efo-valid,input[type="search"].efo-valid,input[type="password"].efo-valid,input[type="url"].efo-valid,input[type="number"].efo-valid,select.efo-valid,textarea.efo-valid {
background-color: #e9f2d7;

}

.block-cart--contents {
border-bottom: none;
margin: 25px auto 50px;

}

.block-cart--contents a {
text-decoration: none;
color: #444;

}

.block-cart--goods-list li {
padding: 20px 10px;

}

.block-cart--subtotal-container .block-cart--subtotal {
font-size: 16px;
text-align: center;
border: 3px #ccc solid;
padding: 10px 3px;

}

.block-login--member-body {
    padding: 10px;
    border: unset;
    background: #fff;

}

.block-login--member,.block-login--amazon {
    border: 1px solid #ddd;
    padding: 10px;
    margin-bottom: 10px;
}

h2.block-login--member-header,h2.block-login--snslogin-header,h2.block-login--amazon-header {
    line-height: 140%;
    padding-bottom: 0px;
    position: relative;
    padding-left: 20px;
}


h2.block-login--member-header span,h2.block-login--snslogin-header span,h2.block-login--amazon-header span {
display: unset;
font-size: unset;
line-height: unset;
letter-spacing: unset;
margin-top: unset;

}

.block-login--body > div:last-of-type {
margin-bottom: 0;
border: 1px solid #ddd;


}

.block-login--snslogin {
padding: 20px 20px 30px 20px;
border: 1px solid #dcdcdc;
margin-bottom: 30px;

}

.block-login--snslogin-body,.block-login--amazon-body {
padding: unset;
border: unset;
background: unset;

}

.block-login--amazon-login {
margin-top: 20px;
margin-bottom: 20px;

}

.block-order-estimate--register-customer-checkbox-message {
position: relative;

}

.block-order-estimate--register-customer-checkbox-message{
padding-left: 30px;

}

.block-order-estimate--register-customer-checkbox-message label::before{
content: "";
display: block;
position: absolute;
top: 2px;
left: 0;
width: 18px;
height: 18px;
border: 1px solid #999;

}

.block-order-estimate--register-customer-checkbox-message label.checked::after{
content: "";
display: block;
position: absolute;
top: 2px;
left: 2px;
width: 18px;
height: 8px;
opacity: 1;
-webkit-transition: all .4s ease;
-moz-transition: all .4s ease;
transition: all .4s ease;
transform: rotate(-40deg);
-webkit-transform: rotate(-40deg);
-moz-transform: rot;
border-bottom: 2px #FC0019 solid;
border-left: 2px #FC0019 solid;

}

/* ----購入者情報枠削除---- */
.block-login--first-time-body {
    border: none;
}

/* ----初めての購入者情報・枠---- */
span.block-login--first-time-title {
    font-size: 18px;
    padding-left: 20px;
}