@charset "UTF-8";

/*モーダルウインドウ*/
@import url("https://fonts.googleapis.com/css?family=Noto+Sans+JP:500,700,900&display=swap&subset=japanese");

#payModal .modal img{
display: block;
margin: 0 auto;
width: 100%;
}

#payModal img.pc_none{
display: none;
}
#payModal img.sp_none{
display: block;
}

#payModal{
font-family: 'Noto Sans JP',"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,sans-serif;
color: #010232;
font-weight: 500;
}

@media screen and (max-width:767px){
#payModal img.pc_none{
display: block;
}
#payModal img.sp_none{
display: none;
}
}


@media (min-width: 768px) {
#payModal {
margin: 0 auto;
}

#payModal .hiddenPC,.hidden{
display: none;
}


#payModal {
-webkit-box-sizing: border-box;
box-sizing: border-box;
display: none;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 9999;
}
#payModal .modal {
-webkit-box-sizing: border-box;
box-sizing: border-box;
position: absolute;
left: 50%;
top: 50%;
padding: 20px 20px;
width: 940px;
height: calc(90vh - 80px);
background: #ffffff;
color: #010232;
-webkit-transform: translateX(-50%) translateY(-50%) translateY(40px);
transform: translateX(-50%) translateY(-50%) translateY(40px);
z-index: 1;
}
#payModal .modal .modal_inner {
-webkit-box-sizing: border-box;
box-sizing: border-box;
width: 100%;
height: 100%;
padding: 50px 70px;
padding-right: 66px;
overflow-y: scroll;
-webkit-overflow-scrolling: touch;
}
#payModal .modal .modal_inner::-webkit-scrollbar {
-webkit-box-sizing: border-box;
box-sizing: border-box;
width: 4px;
}
#payModal .modal .modal_inner::-webkit-scrollbar-track {
-webkit-box-sizing: border-box;
box-sizing: border-box;
background: #e6e6e6;
}
#payModal .modal .modal_inner::-webkit-scrollbar-thumb {
-webkit-box-sizing: border-box;
box-sizing: border-box;
background: #b3b3b3;
}
#payModal .modal .modal_inner h3 {
-webkit-box-sizing: border-box;
box-sizing: border-box;
margin:0;
margin-bottom: 40px;
padding: 22px 1em;
background: #d99f0c;
color: #ffffff;
font-size: 1.5em;
font-weight: bold;
text-align: center;
line-height: 1.5;
letter-spacing: 0.06em;
}
#payModal .modal .modal_inner .visual {
-webkit-box-sizing: border-box;
box-sizing: border-box;
margin-bottom: 40px;
}
#payModal .modal .modal_inner dl.notice dt, #payModal .modal .modal_inner dl.notice dd {
-webkit-box-sizing: border-box;
box-sizing: border-box;
font-size: 0.875em;
line-height: 1.71;
letter-spacing: 0.03em;
margin:0 auto;
}
#payModal .modal .modal_inner dl.notice dt {
-webkit-box-sizing: border-box;
box-sizing: border-box;
margin-top: 1.25em;
}
#payModal .modal .modal_inner dl.notice dt:first-child {
-webkit-box-sizing: border-box;
box-sizing: border-box;
margin-top: 0;
}
#payModal .modal .modal_inner dl.notice dd ol.num {
-webkit-box-sizing: border-box;
box-sizing: border-box;
counter-reset: cnt;
margin: 0;
padding: 0;
list-style-type: none;
}
#payModal .modal .modal_inner dl.notice dd ol.num li {
-webkit-box-sizing: border-box;
box-sizing: border-box;
counter-increment: cnt;
position: relative;
padding-left: 1.25em;
}
#payModal .modal .modal_inner dl.notice dd ol.num li::before {
-webkit-box-sizing: border-box;
box-sizing: border-box;
content: counter(cnt) ".";
position: absolute;
left: 0;
top: 0;
}
#payModal .modal .modal_inner dl.notice dd ul.note li, 
#payModal .modal .modal_inner dl.notice dd ul.list li {
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding-left: 1em;
text-indent: -1em;
}
#payModal .modal .close {
-webkit-box-sizing: border-box;
box-sizing: border-box;
position: absolute;
right: 25px;
top: -80px;
width: 45px;
height: 45px;
text-indent: -9999px;
overflow: hidden;
}
#payModal .modal .close::before, #payModal .modal .close::after {
-webkit-box-sizing: border-box;
box-sizing: border-box;
content: '';
position: absolute;
top: 50%;
left: 50%;
width: 4px;
height: 64px;
background: #ffffff;
border-radius: 2px;
}
#payModal .modal .close::before {
-webkit-box-sizing: border-box;
box-sizing: border-box;
-webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
transform: translateX(-50%) translateY(-50%) rotate(45deg);
}
#payModal .modal .close::after {
-webkit-box-sizing: border-box;
box-sizing: border-box;
-webkit-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
transform: translateX(-50%) translateY(-50%) rotate(-45deg);
}
.shade {
-webkit-box-sizing: border-box;
box-sizing: border-box;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(1, 2, 50, 0.8);
-webkit-backdrop-filter: blur(5px);
backdrop-filter: blur(5px);
z-index: 0;
}
}



@media (max-width: 767px) {
body.showing_modal {
-webkit-box-sizing: border-box;
box-sizing: border-box;
position: fixed;
overflow: hidden;
width: 100%;
}

.hidden{
display: none;
}

#payModal .shade {
-webkit-box-sizing: border-box;
box-sizing: border-box;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(1, 2, 50, 0.8);
-webkit-backdrop-filter: blur(5px);
backdrop-filter: blur(5px);
z-index: 0;
}


#payModal {
-webkit-box-sizing: border-box;
box-sizing: border-box;
display: none;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 9999;}

#payModal .modal {
-webkit-box-sizing: border-box;
box-sizing: border-box;
position: absolute;
left: 50%;
top: 50%;
padding: 0;
padding-top: 29.33333vw;
width: 92vw;
height: calc(90vh - 16vw);
background: #ffffff;
color: #010232;
transform: translateX(-50%) translateY(-50%) translateY(-8vw);
z-index: 1;
}

#payModal .modal .modal_inner {
-webkit-box-sizing: border-box;
box-sizing: border-box;
width: 87.73333vw;
height: calc(100% - 1.86667vw);
padding: 2.66667vw 4.53333vw 8vw;
padding-right: calc(4.53333vw - 4px);
margin:0 auto;
overflow-y: scroll;
	background: inherit;
-webkit-overflow-scrolling: touch;}

#payModal .modal .modal_inner::-webkit-scrollbar {
-webkit-box-sizing: border-box;
box-sizing: border-box;
width: 4px;
}

#payModal .modal .modal_inner::-webkit-scrollbar-track {
-webkit-box-sizing: border-box;
box-sizing: border-box;
background: #e6e6e6;
}

#payModal .modal .modal_inner::-webkit-scrollbar-thumb {
-webkit-box-sizing: border-box;
box-sizing: border-box;
background: #b3b3b3;
}

#payModal .modal .modal_inner h3 {
-webkit-box-sizing: border-box;
box-sizing: border-box;
position: absolute;
	height: auto;
top: 0;
left: 0;
margin: 0;
padding: 3.73333vw 1em;
width: 100%;
background-color: #d99f0c;
background: #d99f0c;
color: #ffffff;
font-size: 5.86667vw;
font-weight: bold;
text-align: center;
line-height: 1.5;
letter-spacing: 0.06em;
	z-index: 9999;
}

#payModal .modal .modal_inner .visual {
-webkit-box-sizing: border-box;
box-sizing: border-box;
margin-bottom: vw(20);
}
#payModal .modal .modal_inner dl.notice dt, dd {
-webkit-box-sizing: border-box;
box-sizing: border-box;
font-size: 0.875em;
line-height: 1.71;
letter-spacing: 0.03em;
    margin: 0 auto;
}

#payModal .modal .modal_inner dl.notice dt {
-webkit-box-sizing: border-box;
box-sizing: border-box;
margin-top: 1.25em;}

#payModal .modal .modal_inner dl.notice dt:first-child {
-webkit-box-sizing: border-box;
box-sizing: border-box;
margin-top: 0;
}
#payModal .modal .modal_inner dd ol.num {
-webkit-box-sizing: border-box;
box-sizing: border-box;
counter-reset: cnt;
    margin: 0;
    padding: 0;
    list-style-type: none;
}

#payModal .modal .modal_inner dd ol.num li {
-webkit-box-sizing: border-box;
box-sizing: border-box;
counter-increment: cnt;
position: relative;
padding-left: 1.25em;}

#payModal .modal .modal_inner dd ol.num li::before {
-webkit-box-sizing: border-box;
box-sizing: border-box;
content: counter(cnt)'.';
position: absolute;
left: 0;
top: 0;
}
#payModal .modal .modal_inner dd ul.list li {
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding-left: 1em;
text-indent: -1em;
}

#payModal .modal .close {
-webkit-box-sizing: border-box;
box-sizing: border-box;
position: absolute;
bottom:-16vw;
left: 0;
right: 0;
width: 44vw;
height: 10.66667vw;
background: #d99f0c;
border-radius: 5.33333vw;
text-indent: -9999px;
margin:0 auto;
overflow: hidden;}

#payModal .modal .close::before, #payModal .modal .close::after {
-webkit-box-sizing: border-box;
box-sizing: border-box;
content: '';
position: absolute;
top: 50%;
left: 50%;
width: 0.53333vw;
height: 6.4vw;
background: #ffffff;
border-radius: 0.26667vw;
}
#payModal .modal .close::before {
-webkit-box-sizing: border-box;
box-sizing: border-box;
-webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
transform: translateX(-50%) translateY(-50%) rotate(45deg);
}
#payModal .modal .close::after {
-webkit-box-sizing: border-box;
box-sizing: border-box;
-webkit-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
transform: translateX(-50%) translateY(-50%) rotate(-45deg);
}

@media (orientation: landscape){
#payModal .modal {
padding-top: 14.33333vw;
}

#payModal .modal .modal_inner h3 {
padding: .73333vw 1em;
font-size: 4vw;

}
}
}