@charset "UTF-8";
button {
margin: 0;
padding: 0;
background: none;
border: none;
outline: none;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
cursor: pointer;
color: #ad2273;
}
a img:hover {
opacity: 0.7;
transition: 0.3s;
}
.m0 {
margin: 0!important;
}
.mb10 {
margin-bottom: 10px;
}
.anchor::after {
transform: rotate(90deg);
}
.c-red {
color: #d90000 !important;
}
.c-magenta {
color: #d82b90;
}
.main-wrap {
display: flex;
max-width: 820px;
}
.cp-block {
margin-top: 4.8rem;
}
.banner-block {
max-width: 720px;
margin: 3.2rem auto 0;
}
.download-box {
background: #F5F5F5;
padding: 15px;
max-width: 460px;
}
.app-wrap {
display: flex;
gap: 20px;
}
@layer layout {
.img-box {
margin-top: 3.2rem!important;
  }
}
.lead-box {
margin-top: 5.6rem;
}
.lead-text {
font-size: 2rem;
font-weight: bold;
margin-top: 3.2rem;
}
.select-point {
display: flex;
max-width: 654px;
margin:2.4rem auto 0;
justify-content: center;
}
.point-wrap {
display: flex;
flex-direction: column;
align-items: center;
max-width: 150px;
}
.point-wrap p{
font-size: 18px;
margin-top: 0;
}
/*------ Q & A ------*/
.mt0 {
margin-top: 0!important;
}
.mb16 {
margin-bottom: 16px!important;
}
.toggle-att-list-v2 {
width: 820px;
margin: 36px auto 0;
padding: 0;
}
.hdg-lv02-tgl-v2 {
padding: 10px 0;
position: relative;
zoom: 1;
background: url(/app-files/img/accordion_01.svg) no-repeat center right 10px;
}
.js-toggle-02-v2.open .hdg-lv02-tgl-v2 {
background: url(/app-files/img/accordion_02.svg) no-repeat center right 10px;
}
.hdg-lv02-tgl-v2 > span {
position: relative;
padding: 3px 40px 0 55px;
font-size: 1.6rem;
display: block;
}
.hdg-lv02-tgl-v2 > span::before {
content: url(/foreign_deposit/img/question_01.svg);
display: inline-block;
width: 44px;
height: 44px;
position: absolute;
top: 50%;
left: 0;
transform: translateY(-50%);
}
.open .hdg-lv02-tgl-v2 > span::before {
content: url(/foreign_deposit/img/question_02.svg);
display: block;
width: 44px;
height: 44px;
position: absolute;
top: 50%;
left: 0;
transform: translateY(-50%);
}
.js-toggle-02-v2 {
list-style: none;
}
.js-toggle-02-v2 > .content {
display: none;
}
.js-toggle-02-v2.open > .content {
position: relative;
display: block;
border-top: 1px solid #cbcbcb;
padding: 10px 10px 30px 55px;
animation: fadeIn 0.3s ease-in-out forwards;
}
.js-toggle-02-v2.open > .content::before {
content: url(/foreign_deposit/img/answer_01.svg);
display: block;
width: 20px;
height: 20px;
position: absolute;
top: 20px;
left: 0;
}
.js-toggle-02-v2.open > .content .hdg-lv03 {
width: 100%;
margin-top: 20px;
}
.js-toggle-02-v2 .unorder-list {
list-style: none; 
margin: 1.6rem 0 0;
padding: 0;
}
.js-toggle-02-v2 .number-list_v1 {
margin: 1.6rem 0 0 2rem;
padding: 0;
}
.number-list_v1 > li {
position: relative;
list-style: decimal outside;
padding-bottom: 8px;
}

/* ===ポップアップ、モーダル=== */
.modal-btn {
width: 100%;
}
.pop-up-box-wrap {
display: flex;
justify-content: center;
flex-wrap: wrap;
}
.tm-js_modal {
width: 100%;
}
.tm-js_modal .modal-inner {
width: 100%;
height: 100%;
padding: 26px 23px 50px;
background: #fff;
overflow: auto;
z-index: 1001;
position: relative;
pointer-events: auto;
border-radius: 8px;
}
.tm-js_modal .modal-inner> :first-child {
margin-top: 0;
}
.tm-js_modal .modal-inner> :last-child {
margin-bottom: 0;
}
.modal {
position: fixed;
padding: 0 20px;
pointer-events: none;
z-index: 1001;
transition: opacity 0.5s cubic-bezier(0, 0.43, 0, 0.97), transform 0.5s cubic-bezier(0, 0.43, 0, 0.97);
transform: scale(0);
opacity: 0;
}
.modal-in {
opacity: 1;
transform: scale(1);
transition: opacity 0.5s cubic-bezier(0, 0.43, 0, 0.97), transform 0.5s cubic-bezier(0, 0.43, 0, 0.97);
}
.modal-bg {
position: fixed;
top: 0;
left: 0;
background-color: rgba(0, 0, 0, 0.6);
width: 100%;
height: 100%;
z-index: 1000;
transition: opacity 0.5s cubic-bezier(0, 0.43, 0, 0.97), transform 0s 0.5s cubic-bezier(0, 0.43, 0, 0.97);
transform: scale(0);
opacity: 0;
}
.modal-bg-in {
opacity: 1;
transform: scale(1);
transition: opacity 0.5s;
}
.modal-inner a:hover {
text-decoration: underline;
}
.tm-js_modal .modal-close {
content: "";
width: 50px;
height: 50px;
background: url(/jp/ja/payment/aeonpay/images/close.svg) no-repeat 50% 50%/ 100% 100%;
border: none;
pointer-events: auto;
cursor: pointer;
outline: none;
padding: 0;
position: absolute;
bottom: -20px;
left: 49%;
transform: translateX(-50%);
z-index: 1002;
  }
.tm-js_modal .modal-close:hover {
background: url(/jp/ja/payment/aeonpay/images/close_hover.svg) no-repeat 50% 50%/ 100% 100%;
transition: 0.3s
}
.modal-inner .modal-area  {
position: relative;
width: 100%;
height: 0;
margin: 0 auto;
overflow: hidden;
}
.select__label{
width: fit-content;
padding: 5px 24px;
border-radius: 999px;
background-color: #FBEAF4;
color: #AD2273;
font-size: 1.4rem;
font-weight: 700;
line-height: 1.6;
letter-spacing: 0.3px;
text-align: center;
margin: 0 auto;
}
.arrow,.plus {
margin-top: 3.2rem;
position: relative;
}
.arrow::after {
position: absolute;
content: "";
background-image: url(/content/dam/abk/jp/ja/common/images/2_magenta_S.png);
background-repeat: no-repeat;
background-size: 100%;
bottom: -50px;
left: 50%;
transform: translateX(-50%);
width: 60px;
height: 20px;
}
.arrow-top {
margin-top: 6rem;
}
.plus::before,.plus::after {
content: "";
position: absolute;
left: 50%;
background-color: #D82B90; /* 線の色 */
transform: translate(-50%, -50%);
}
.plus::before {
bottom: -66px;
width: 10px;
height: 36px;

}
/* 横棒 */
.plus::after {
bottom: -40px;
width: 36px;
height: 10px;
}
.card-flex {
display: flex;
justify-content: center;
}
.step-card__image{
min-height: 310px;
display: flex;
align-items: center;
}
@media screen and (min-width: 768px) {
.sp-db {
display: none;
}
.main-wrap {
margin: 3.2rem auto;
gap: 30px;
font-size: 20px;
}
.img-block {
width: 40%;
}
.main-list {
margin: 5.6rem 0 0;
padding-left: 30px;
}
.main-list li:nth-of-type(n+2) {
margin-top: 2.4rem;
}
.download-box {
margin: 5.6rem auto 0;
}
/* ===ポップアップ=== */
.button-v2__type:hover {
border-color: #7e7e7e;
background-color: #f5f5f5;
transition: 0.3s
}
.tm-js_modal {
width: 100%;
max-width: 900px;
height: 700px;
}
.tm-js_modal.modal-img {
max-width: 500px;
height: 400px;
}
.modal-icon::after {
top: 0;
right: 0px;
}
.step-card-wrap__list__inner[data-col-pc="2"] {
justify-content: center;
}
.card-v3 > [class*="__type"] {
display: flex;
flex-direction: column;
}
.card-v3__head + .card-v3__body {
flex-grow: 1;
}
.flex-center {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
}

/* ==========SP========== */
@media screen and (max-width: 767px) {
.pc-db {
display: none;
}
.sp-w100 {
width: 100%!important;
}
.main-wrap {
gap: 20px;
}
.img-block {
width: 100%;
}
.main-list {
padding-left: 20px;
}
.main-list li:nth-of-type(n+2) {
margin-top:8px;
}
.download-box {
margin: 2.4rem auto 0;
}
.select-point {
margin:1.6rem auto 0;
}
.tm-js_modal {
width: 100%;
max-width: 500px;
height: 500px;
}
.modal-icon::after {
top: 50%;
right: 0;
margin-top: -15px;
}

.Main__assist .main-assist__inner {
padding-right: 16px !important;
padding-left: 16px !important;
}
.main-assist__inner {
 padding-top: 2rem !important;
padding-bottom: 2rem !important;
}


/*------Q & A ------*/
.toggle-att-list-v2 {  
width: auto;
}


.card-v3__image {
text-align: center;
}
.w100-sp img {
width: 100px;
}
.card-flex {
margin-bottom: 20px;
}
.w150 img {
width: 150px;
}
.step-card__image{
min-height: 340px;
}
}
