@charset "UTF-8";

/* ログイン */
.sw-frame { background: #ffffff; margin: 10px; border-radius: 5px; border: 1px solid #cccccc; }
.sw-frame dt { padding: 10px 10px 0 10px; font-size: 11pt; height: 20px; line-height: 20px; }
.sw-frame dt span { float: left; font-weight: bold; }
.sw-frame dt span.icon { background: #ffbf37; width: 5px; height: 17px; margin-right: 5px; border-radius: 4px; display: block; }
.sw-frame dd { padding: 5px 10px 10px 10px; font-size: 10pt; clear: left; }
.sw-frame dd ul { list-style-type: disc; padding-left: 16px; }

.sw-frameMessage { background: #fbf8ec; margin: 10px; border-radius: 5px; font-size: 10pt; font-weight: bold; color: #525252; padding: 10px 15px; list-style-type: disc; list-style-position: outside; border: 1px solid #c4b189; }

.sw-Form { background: #fbf8eb; padding: 10px; margin: 10px; border-radius: 5px; }
.sw-Form dt { font-size: 10pt; font-weight: bold; color: #7c602b; }
.sw-Form dd { font-size: 10pt; border-bottom: 1px solid #cccccc; margin-bottom: 10px; padding-bottom: 10px; }
.sw-Form dd:last-of-type { border-bottom: none; }

.sw-Form_NonBorder { background: #fbf8eb; padding: 10px; margin: 0 10px 10px; border-radius: 5px; }
.sw-Form_NonBorder dt { font-size: 11pt; font-weight: bold; color: #7c602b; padding-bottom: 5px; }
.sw-Form_NonBorder dd { font-size: 11.5pt; padding-bottom: 20px; }

.sw-Form_MiniMargin { margin: 0 5px; }

.sw-Form_InputForm { width: 100%; height: 44px; line-height: 22px; font-size: 12pt; box-shadow: none; -webkit-appearance: none; box-sizing: border-box; border: 1px solid #aaaaaa; border-radius: 3px; background: #ffffff; padding: 0 5px; }

.sw-Form_InputForm-half { width: 49%; height: 44px; line-height: 22px; font-size: 12pt; box-shadow: none; -webkit-appearance: none; box-sizing: border-box; border: 1px solid #aaaaaa; border-radius: 3px; background: #ffffff; padding: 0 5px; }

.sw-Form_InputForm-60 { width: 60%; height: 44px; line-height: 22px; font-size: 12pt; box-shadow: none; -webkit-appearance: none; box-sizing: border-box; border: 1px solid #aaaaaa; border-radius: 3px; background: #ffffff; padding: 0 5px; }

.sw-Form_RadioBtnBox { background: #ffffff; border: 1px solid #aaaaaa; border-radius: 5px; }
.sw-Form_RadioBtnBox li { border-bottom: 1px solid #cccccc; }
.sw-Form_RadioBtnBox li:last-child { border: none; }
.sw-Form_RadioBtnBox li label { width: 100%; height: 40px; line-height: 40px; }
.sw-Form_RadioBtnBox input { display: inline-block; }
.sw-Form_RadioBtnBox input + label { position: relative; display: inline-block; cursor: pointer; }
@media (min-width: 1px) { .sw-Form_RadioBtnBox input { margin: 0; display: none; }
  .sw-Form_RadioBtnBox input + label { position: relative; display: inline-block; cursor: pointer; }
  .sw-Form_RadioBtnBox input + label::before { content: ""; position: relative; top: 20px; left: 10px; -moz-box-sizing: border-box; box-sizing: border-box; display: block; width: 24px; height: 24px; margin-top: -12px; margin-right: 15px; background: #ffffff; float: left; }
  .sw-Form_RadioBtnBox input + label::before { border: 3px solid #cccccc; border-radius: 30px; }
  .sw-Form_RadioBtnBox input:checked + label::after { content: ""; position: absolute; top: 15px; -moz-box-sizing: border-box; box-sizing: border-box; display: block; }
  .sw-Form_RadioBtnBox input:checked + label::after { left: 16px; width: 12px; height: 12px; margin-top: -1px; background: #2bab2d; border-radius: 8px; } }

.sw-Form_RadioBtnBoxLongText { background: #ffffff; border: 1px solid #aaaaaa; border-radius: 5px; }
.sw-Form_RadioBtnBoxLongText li { border-bottom: 1px solid #cccccc; }
.sw-Form_RadioBtnBoxLongText li:last-child { border: none; }
.sw-Form_RadioBtnBoxLongText li label { width: 100%; padding: 10px; box-sizing: border-box; display: flex; align-items: center; }
.sw-Form_RadioBtnBoxLongText input { display: inline-block; }
.sw-Form_RadioBtnBoxLongText input + label { display: flex; align-items: center; }
@media (min-width: 1px) { .sw-Form_RadioBtnBoxLongText input { margin: 0; display: none; }
  .sw-Form_RadioBtnBoxLongText input + label { display: flex; align-items: center; } }

.sw-Form_RadioBtnBoxLongText-label { display: inline-block; width: 82%; word-wrap: break-word; line-height: 160%; }

.sw-Form_RadioBtnBoxLongText-markOutside { content: ""; position: relative; -moz-box-sizing: border-box; box-sizing: border-box; display: block; width: 24px; height: 24px; margin-right: 10px; background: #ffffff; border: 3px solid #cccccc; border-radius: 30px; }

.sw-Form_RadioBtnBoxLongText-markInside { content: ""; position: absolute; top: 4px; left: 3px; -moz-box-sizing: border-box; box-sizing: border-box; display: block; width: 12px; height: 12px; margin-top: -1px; background: #2bab2d; border-radius: 8px; transform: scale(0, 0); }

.sw-Form_RadioBtnBoxLongText input:checked + .sw-Form_RadioBtnBoxLongText-markOutside .sw-Form_RadioBtnBoxLongText-markInside { animation: radio-select 0.1s linear; transform: scale(1, 1); }

.sw-Form_RadioBtn { display: inline-block; }
.sw-Form_RadioBtn + label { position: relative; display: inline-block; cursor: pointer; }
@media (min-width: 1px) { .sw-Form_RadioBtn { margin: 0; display: none; }
  .sw-Form_RadioBtn + label { position: relative; display: inline-block; cursor: pointer; }
  .sw-Form_RadioBtn + label::before { content: ""; position: relative; top: 20px; left: 10px; -moz-box-sizing: border-box; box-sizing: border-box; display: block; width: 24px; height: 24px; margin-top: -12px; margin-right: 15px; background: #ffffff; float: left; }
  .sw-Form_RadioBtn + label::before { border: 3px solid #cccccc; border-radius: 30px; }
  .sw-Form_RadioBtn:checked + label::after { content: ""; position: absolute; top: 15px; -moz-box-sizing: border-box; box-sizing: border-box; display: block; }
  .sw-Form_RadioBtn:checked + label::after { left: 16px; width: 12px; height: 12px; margin-top: -1px; background: #2bab2d; border-radius: 8px; } }

.sw-Form_SelectBtn { width: 100%; height: 44px; -webkit-appearance: button; appearance: button; background: #ffffff url("/images/sp/common/object/component/form/icon_select.svg") no-repeat; background-size: 25px 5px; background-position: right center; line-height: 30px; font-size: 11pt; color: #525252; vertical-align: middle; border: 1px solid #aaaaaa; border-radius: 3px; text-indent: 1em; }

.sw-Form_SelectBtn-android { width: 100%; height: 44px; -webkit-appearance: button; appearance: button; background: #ffffff; background-size: 25px 5px; background-position: right center; line-height: 30px; font-size: 11pt; color: #525252; vertical-align: middle; border: 1px solid #aaaaaa; border-radius: 3px; text-indent: 1em; }

.sw-Form_SelectBtn-small { width: 24%; height: 44px; -webkit-appearance: button; appearance: button; background: #ffffff url("/images/sp/common/object/component/form/icon_select.svg") no-repeat; background-size: 25px 5px; background-position: right center; line-height: 30px; font-size: 11pt; color: #525252; vertical-align: middle; border: 1px solid #aaaaaa; border-radius: 3px; text-indent: 1em; text-indent: 0.5em; }

.sw-Form_SelectBtn-mini { width: 15%; height: 44px; -webkit-appearance: button; appearance: button; background: #ffffff url("/images/sp/common/object/component/form/icon_select.svg") no-repeat; background-size: 25px 5px; background-position: right center; line-height: 30px; font-size: 11pt; color: #525252; vertical-align: middle; border: 1px solid #aaaaaa; border-radius: 3px; text-indent: 1em; text-indent: 0.5em; }

.sw-Form_CheckBox { position: relative; cursor: pointer; font-size: 9pt; margin: 0 5px 3px 0; }
.sw-Form_CheckBox:before { width: 0.75rem; height: 0.375rem; position: absolute; top: 0.125rem; left: 0.1875rem; z-index: 1; content: ""; -webkit-transition: -webkit-transform 0.4s cubic-bezier(0.45, 1.8, 0.5, 0.75); transition: transform 0.4s cubic-bezier(0.45, 1.8, 0.5, 0.75); -webkit-transform: rotate(-45deg) scale(0, 0); transform: rotate(-45deg) scale(0, 0); border: 2px solid #00b200; border-top-style: none; border-right-style: none; }
.sw-Form_CheckBox:checked:before { -webkit-transform: rotate(-45deg) scale(1, 1); transform: rotate(-45deg) scale(1, 1); }
.sw-Form_CheckBox:after { position: absolute; top: -0.25em; left: -0.125em; width: 1.4em; height: 1.4em; content: ""; cursor: pointer; border: 2px solid #f2f2f2; background: #ffffff; }

.sw-Form_CheckBox-label { font-size: 11pt; margin-left: 8px; }

.sw-Form_CheckBoxTag { display: inline-block; }
.sw-Form_CheckBoxTag input { display: none; }
.sw-Form_CheckBoxTag input:checked + label { background: #2bab2d; border: 1px solid #2bab2d; color: #ffffff; }
.sw-Form_CheckBoxTag label { display: inline-block; border-radius: 6px; text-align: center; text-decoration: none; border: 1px solid #aaaaaa; padding: 4px 12px; margin: 5px; background: #ffffff; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }

.sw-Form_Textarea { width: 100%; height: 100px; font-size: 12pt; box-shadow: none; -webkit-appearance: none; box-sizing: border-box; border: 1px solid #aaaaaa; border-radius: 3px; resize: none; }

.sw-Form_Error { background: #ffeeee; margin: 10px; border-radius: 5px; font-size: 10pt; font-weight: bold; color: #ff0000; padding: 10px 15px; list-style-type: disc; list-style-position: outside; border: 1px solid #ff0000; border-width: 2px; }

.sw-Form_Error-item { margin-left: 20px; }

.sw-Form_Error-background { background: #ffeeee !important; }

.sw-Form_Error-text { color: #ff0000 !important; }

.sw-ErrorMessageFlameTop { width: initial; border: 1px solid #f0bdbb; background-color: #ffeeee; border-radius: 3px; font-size: 10pt; color: #ca3021; padding: 10px; list-style-type: disc; margin-bottom: 20px; }

.sw-ErrorMessageFlameTop a { text-decoration: none; color: #0063dc; }

.sw-Form_ErrorMessage { color: #ca3021; font-size: 10pt; margin: 8px 0 0; padding: 0; list-style-type: none; }

.sw-Form_ErrorMessage-item { background: url(/images/sp/common/object/component/form/icon_formError.svg); background-size: 16px 16px; background-repeat: no-repeat; background-position: left top 3px; text-align: left; padding-left: 20px; }

.sw-Form_ErrorMessage-item:last-child { margin-bottom: 0; }

.sw-Form_CheckBox-box .sw-Form_ErrorMessage { margin: 12px auto 5px; }

.sw-Form_Label { width: 35px; height: 17px; margin: 0 0 4px 5px; }

.sw-FormConfirm { margin: 0 10px; }

.sw-FormConfirm_Title { height: 30px; line-height: 30px; font-size: 11pt; background: #f2f2f2; padding: 5px 10px; border: 1px solid #cccccc; }

.sw-FormConfirm_Items { background: #ffffff; padding-bottom: 10px; border: 1px solid #cccccc; border-top: none; }
.sw-FormConfirm_Items:last-child { padding-bottom: 0; }

.sw-FormConfirm_Item { padding: 10px; border-bottom: 1px solid #cccccc; word-wrap: break-word; }
.sw-FormConfirm_Item:last-child { border-bottom: 0; }

.sw-FormConfirm_Item-title { display: inline-block; font-size: 11pt; margin-bottom: 5px; }

.sw-FormConfirm_Item-data { font-size: 11.5pt; font-weight: bold; }

.sw-Form_Step3 { width: 95%; height: 40px; border: 1px solid #009100; border-radius: 5px; line-height: 40px; margin: 10px auto; }
.sw-Form_Step3-boxInner { height: 100%; margin: auto; text-align: center; font-size: 10pt; }
.sw-Form_Step3-stepFirst { width: 33%; height: 40px; box-sizing: border-box; -webkit-box-sizing: border-box; position: relative; z-index: 2; border-top-left-radius: 3px; border-bottom-left-radius: 3px; color: #009100; float: left; }
.sw-Form_Step3-stepSecond { width: 33%; height: 40px; box-sizing: border-box; -webkit-box-sizing: border-box; position: relative; z-index: 2; color: #009100; float: left; padding-right: 5px; }
@media screen and (min-width: 428px) { .sw-Form_Step3-stepSecond { width: 33.6%; } }
.sw-Form_Step3-stepThird { width: 30%; height: 40px; position: absolute; right: 0; z-index: 10; color: #009100; padding-right: 10px; float: right; }
.sw-Form_Step3-stepThirdActive { right: 2.5%; box-sizing: border-box; z-index: 10; position: absolute; padding-right: 10px; }
@media screen and (min-width: 360px) and (max-width: 414px) { .sw-Form_Step3-stepThirdActive { width: 30.4%; } }
.sw-Form_Step3-triangleActive { width: 0; height: 0; border-style: solid; border-width: 20px 0 20px 8px; border-color: transparent transparent transparent #009100; position: relative; float: left; }
.sw-Form_Step3-triangle { width: 0; height: 0; border-style: solid; border-width: 20px 0 20px 8px; border-color: transparent transparent transparent #ffffff; background: #009100; float: left; }
.sw-Form_Step3-triangleNone { width: 0; height: 40px; position: relative; top: 0; float: left; }
.sw-Form_Step3-lineTop { height: 24px; border-right: 1px solid #009100; transform: rotate(-30deg); -webkit-transform: rotate(-30deg); position: absolute; top: -2px; }
.sw-Form_Step3-lineBtm { height: 24px; border-right: 1px solid #009100; transform: rotate(30deg); -webkit-transform: rotate(30deg); position: absolute; top: 18px; }
.sw-Form_Step3 .active { background: #009100; color: #ffffff; }
.sw-Form_Step3 .active3rd { background: #009100; color: #ffffff; right: 2.5%; box-sizing: border-box; z-index: 10; position: absolute; padding-right: 5px; }
@media screen and (min-width: 360px) and (max-width: 414px) { .sw-Form_Step3 .active3rd { width: 30.4%; } }

.sw-Form_Step4 { width: 95%; height: 40px; border: 1px solid #009100; border-radius: 5px; line-height: 40px; margin: 10px auto; }
.sw-Form_Step4-boxInner { height: 100%; margin: auto; text-align: center; font-size: 10pt; }
.sw-Form_Step4-stepFirst { width: 24%; height: 40px; box-sizing: border-box; -webkit-box-sizing: border-box; position: relative; z-index: 2; border-top-left-radius: 3px; border-bottom-left-radius: 3px; color: #009100; float: left; }
.sw-Form_Step4-stepSecond { width: 24%; height: 40px; box-sizing: border-box; -webkit-box-sizing: border-box; position: relative; z-index: 2; color: #009100; float: left; padding-right: 5px; }
.sw-Form_Step4-stepThird { width: 24%; height: 40px; box-sizing: border-box; -webkit-box-sizing: border-box; position: relative; z-index: 2; color: #009100; float: left; padding-right: 5px; }
.sw-Form_Step4-stepFourth { width: 25%; height: 40px; position: absolute; right: 0; z-index: 10; color: #009100; padding-right: 5px; float: right; }
.sw-Form_Step4-stepFourthActive { right: 2.5%; box-sizing: border-box; z-index: 10; position: absolute; padding-right: 5px; }
@media screen and (min-width: 360px) and (max-width: 414px) { .sw-Form_Step4-stepFourthActive { width: 30.4%; } }
.sw-Form_Step4-triangleActive { width: 0; height: 0; border-style: solid; border-width: 20px 0 20px 8px; border-color: transparent transparent transparent #009100; position: relative; float: left; }
.sw-Form_Step4-triangle { width: 0; height: 0; border-style: solid; border-width: 20px 0 20px 8px; border-color: transparent transparent transparent #ffffff; background: #009100; float: left; }
.sw-Form_Step4-triangleNone { width: 0; height: 40px; position: relative; top: 0; float: left; }
.sw-Form_Step4-lineTop { height: 24px; border-right: 1px solid #009100; transform: rotate(-30deg); -webkit-transform: rotate(-30deg); position: absolute; top: -2px; }
.sw-Form_Step4-lineBtm { height: 24px; border-right: 1px solid #009100; transform: rotate(30deg); -webkit-transform: rotate(30deg); position: absolute; top: 18px; }
.sw-Form_Step4 .active { background: #009100; color: #ffffff; }
.sw-Form_Step4 .active4rd { background: #009100; color: #ffffff; right: 2.5%; box-sizing: border-box; z-index: 10; position: absolute; padding-right: 5px; }
@media screen and (min-width: 360px) and (max-width: 414px) { .sw-Form_Step4 .active4rd { width: 24.5%; } }

/* ログイン */
/* ログイン */
.login-Wrap { -webkit-box-sizing: border-box; box-sizing: border-box; width: 100%; background: #eeeeee; padding: 15px 15px 0; }

.login-Form { background: #ffffff; border-radius: 10px; padding: 20px 15px; }

.login-BrandLogo { text-align: center; margin-bottom: 20px; }

.login-WarningMessage { margin: 0 0 20px; }

.login-Form_InputBox { margin-bottom: 20px; }

.login-Form_Label { font-size: 11pt; font-weight: bold; line-height: 1; }

.login-Form_Item { margin: 10px 0 20px; }

.sw-Form_InputForm:focus { outline: none; border: solid 1px #1ca8dd; }

.login-Domain_List { -webkit-box-sizing: border-box; box-sizing: border-box; position: relative; top: -10px; left: 50%; -webkit-transform: translate(-50%, 0); transform: translate(-50%, 0); display: none; background: #ffffff; width: 100%; color: #525252; font-size: 10pt; font-weight: bold; border: 1px solid; border-top: 0; border-radius: 3px; z-index: 1; }

.login-Domain_List:before { content: ""; display: block; width: 100%; height: 10px; background: #ffffff; position: relative; top: 0; left: 0; z-index: 2; }

.sw-Form_InputForm:focus ~ .login-Domain_List { border-color: #1ca8dd; }

.sw-Form_InputForm ~ .login-Domain_List { border-color: #aaaaaa; }

.login-Domain_Item { display: block; height: auto; padding: 7px; }

.login-Domain_Item-hover { background: #cff1ff; }

.login-Check { font-size: 11pt; text-align: center; }

.login-SubmitBtnBox { margin: 20px 0; }

.login-SubmitBtn { width: 86%; font-size: 11pt; margin: auto; padding: 11px 0; -webkit-border-radius: 6px; border-radius: 6px; text-align: center; font-weight: bold; color: #525252; line-height: 24px; display: block; background: #eeeeee; box-shadow: 0 3px 0 #c4c4c4; -webkit-box-shadow: 0 3px 0 #c4c4c4; border: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; -webkit-box-shadow: 0 3px 0 #0a5eaf; box-shadow: 0 3px 0 #0a5eaf; width: 100%; background: #2395fa; color: #ffffff; }

.login-Form_LinkBox { width: 100%; text-align: center; line-height: 2.2; }

.login-Form_Link { color: #0063dc; text-decoration: none; font-size: 11pt; }

.login-Regist { border-top: 1px solid #cccccc; margin-top: 15px; padding-top: 20px; text-align: center; }

.login-Regist_Link { color: #0063dc; text-decoration: none; font-size: 11pt; }

.login-Character { text-align: center; }

.login-ImageAuth_InputBox { margin-bottom: 25px; }

.login-ImageAuth_ImageBox { width: 100%; background: #faf6dd; border-radius: 3px; text-align: center; }

.login-ImageAuth_Image { vertical-align: top; }

.login-ImageAuth_Lead { font-size: 11pt; margin: 10px 0; }