@charset "UTF-8";

html,body {font-family: sans-serif;margin: 0;padding: 0;min-width: 320px;}
a, a:hover, a:active, a:visited, a:focus {display: block;color: inherit;text-decoration: none;}
.content a{display: inline-block;}
img {border: 0;}
h1,h2,h3,h4,h5,h6{margin: 0;font-weight: 200;}
p, li{line-height: 1.6;}
* {box-sizing: border-box;}

body{background: #190e62 url(../images/img_bg_m.png) no-repeat top center;background-size:cover;color: rgba(255,255,255,.9);}

.wrapper{display: grid; grid-gap: 8px;margin: 6% 5% 3% 5%;background: rgba(0,0,0,.7);border-radius: 28px;padding: 8px;}
.box{border-radius: 20px;color: #fff;padding: 5%;box-sizing: border-box;overflow: hidden;}
#box1{background: url(../images/img_box1_bg.png) no-repeat top left;background-size: cover;}
#box2{background: url(../images/img_box2_bg.png) no-repeat top center;background-size: cover;}
#box3{background: url(../images/img_box3_bg.png) no-repeat center right;background-size: cover;height: 150px;}
#box4{background: #000;}
#box5{background: url(../images/img_box5_bg.png) no-repeat top right;background-size: cover;height: 150px;}
#box6{background: url(../images/img_box6_bg.png) no-repeat top right;background-size: cover;height: 150px;}
#box7{background: #000;font-size: 1.2em;line-height: 2;display: flex;height: 280px;flex-direction: column;justify-content: space-between;}


/*box1*/
#box1 > h1{font-weight: 200;}
.download{display: inline-flex;width: 100%;justify-content: space-between;}
.download img{height: 32px;}
.download-logo{padding-left: 5px;}
.store{display: inline-flex; }
.d-title{width: 90%;margin-bottom: 20px;}
#box1 > h2{margin:20px auto 10px;}

/*box2*/
#box2{padding: 0;position: relative; height: 450px;}
#box2 > img{margin-top: 0px;}
.linksection{padding: 5%;background:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0) 70%);position: absolute;bottom: 0;width: 100%;}
.linksection::before{content: "";background: url(../images/ic_linkout.svg) no-repeat;display: block;margin: 50px 0 20px 0;width: 50px;height: 50px;background-size: contain;}
.linksection a{line-height: 2;font-size: 1.2em;}

/*box4*/
#box4 {height: 230px;}
#box4 a{background: url(../images/img_box4_m.svg) no-repeat bottom right;background-size: 60%;background-position: 10px auto;}
#box4 a:before{content: "";background: url(../images/ic_linkout.svg) no-repeat;display: block;width: 50px;height: 50px;background-size: contain;}
#box4 img{width: 80%;margin-top: 16%;}

#box3 a,#box4 a,#box5 a,#box6 a{display: block;width:100%;height: 100%;}


footer{font-size:12px;color: #fff;text-align: center;line-height: 1.5;opacity: .5; margin: 20px auto;}

.navlogo {padding: 10px 15px 15px;width: 140px;}
.navlogo img{width: 140px;}
/*menu*/
.fullnav {font-family: 'Lato',sans-serif;position: fixed;background: rgba(0,0,0,.9);top: 0;left: 0;width: 100%;height: 0%;opacity: 0;visibility: hidden;-webkit-transition: opacity .35s, visibility .35s, height .35s;transition: opacity .35s, visibility .35s, height .35s;overflow: hidden;}
.fullnav.open {opacity: .9;visibility: visible;height: 100%;z-index:99;}
.fullnav.open li {-webkit-animation: fadeInRight .5s ease forwards;animation: fadeInRight .5s ease forwards;-webkit-animation-delay: .35s;animation-delay: .35s;}
.fullnav.open li:nth-of-type(2) {-webkit-animation-delay: .4s;animation-delay: .4s;}
.fullnav.open li:nth-of-type(3) {-webkit-animation-delay: .45s;animation-delay: .45s;}
.fullnav.open li:nth-of-type(4) {-webkit-animation-delay: .50s;animation-delay: .50s;}
.fullnav nav {position: relative;height: 70%;top: 50%;-webkit-transform: translateY(-50%);transform: translateY(-50%);font-size: 26px;font-family: 'Lato',sans-serif;font-weight: 400;text-align: center;}
.fullnav ul {list-style: none;padding: 0;margin: 0 auto;display: inline-block;position: relative;height: 100%;}
.fullnav ul li {display: block;height: 25%;height: calc(100% / 7);min-height: 50px;position: relative;opacity: 0;}
.fullnav ul li a {display: block;position: relative;color: #FFF;text-decoration: none;overflow: hidden;}
.fullnav ul li a:hover:after, .fullnav ul li a:focus:after, .fullnav ul li a:active:after {width: 100%;}
.fullnav ul li a:after {content: '';position: absolute;bottom: 0;left: 50%;width: 0%;-webkit-transform: translateX(-50%);transform: translateX(-50%);height: 3px;background: #FFF;-webkit-transition: .35s;transition: .35s;}
  
  @-webkit-keyframes fadeInRight {
    0% {opacity: 0;left: 20%;}
    100% {opacity: 1;left: 0;}
  }
  
  @keyframes fadeInRight {
    0% {opacity: 0;left: 20%;}
    100% {opacity: 1;left: 0;}
  }
  
/* Overlay style button*/
.fullnavBtn {position: fixed;top: 4%;right: 3%;height: 27px;width: 35px;cursor: pointer;z-index: 100;-webkit-transition: opacity .25s ease;transition: opacity .25s ease;}
.fullnavBtn:hover {opacity: .7;}
.fullnavBtn.active .top {-webkit-transform: translateY(11px) translateX(0) rotate(45deg);transform: translateY(11px) translateX(0) rotate(45deg);background: #FFF;}
.fullnavBtn.active .middle {opacity: 0;background: #FFF;}
.fullnavBtn.active .bottom {-webkit-transform: translateY(-11px) translateX(0) rotate(-45deg);transform: translateY(-11px) translateX(0) rotate(-45deg);background: #FFF;}
.fullnavBtn span {background: #fff;border: none;height: 2px;width: 100%;position: absolute;top: 0;left: 0;-webkit-transition: all .35s ease;transition: all .35s ease;cursor: pointer;}
.fullnavBtn span:nth-of-type(2) {top: 11px;}
.fullnavBtn span:nth-of-type(3) {top: 22px;}

/*content*/
/*.block_area{background: #FFF;}*/
.container{max-width: 1200px;margin: 0 auto;padding: 0px;font-weight: 300;}
.content{color: #fff;padding: 20px;background: #231A54;}
/*.content p{padding-left: 2em; text-indent: -2em;}*/
.content h1{font-size: 45px;margin-bottom: 40px;}
.content h2 {margin-top: 40px;}
.terms_title{color: #fff;font-size: 50px;text-align: center;margin: 20px auto 0px;}
.terms_title_en{text-align: center;color: #fff;opacity: .3;font-size: 28px;margin: 0 0 20px;letter-spacing: 8px;}
#myIframe{overflow: hidden;}
.crypto_block{margin-bottom: 40px;}
.crypto_block h2{font-weight: 500;}
a.download_doc:after{content: "";display: inline-block;width: 15px;height: 15px;background-image:url(../images/ic_linkout.svg) ;background-size: 100%;transform: rotate(90deg);margin-left: 7px;background-repeat: no-repeat;background-position: 2px 2px;}
a.download_doc{border-top:.5px solid rgba(255,255,255,.5);padding-top: 10px;}

.item, .legal_item {padding: 50px 25px;}
.legal_item{border-bottom: 1px solid rgba(255,255,255,.3);}

/*FAQ*/
input#search {width: 100%;height: 50px;border-radius: 10px;border: 0;padding: 15px;margin: 20px auto;background: rgba(0, 0, 0, .6);color: #fff;display: flex;max-width: 600px;font-size: 16px;text-align: center;}
li.faq-title{margin-top:30px;font-weight: 400;border-bottom: 1px solid rgba(255, 255, 255, 0.4);padding-bottom: 5px;font-size: 24px !important;list-style-type: none !important;margin-left: -1em !important;margin-bottom: 10px;}
ul#search-faq > li{list-style-type: "Q";font-size: 18px;}
#search-faq li{line-height: 1.6;}
#search-faq a{display: inline-block; color: #FFD66E;border-bottom: 1px solid;}
blockquote {border-left: 3px solid #a196e6;margin-left: 0em;padding-left: 1em;font-size: 14px;margin: 30px auto; color: #cac3f4;}
.accordion {display: block;font-size: inherit;margin: 0px;position: relative;}
.accordion input {display: none;position: absolute;visibility: hidden;left: 50%;top: 50%;z-index: 1;}
.accordion-header {font-size: 18px; color: #fff;cursor: pointer;transition: background 0.2s;padding: 10px;position: relative;z-index: 2;}
.accordion-header:hover {color: white;}
.accordion-header:hover:before, .accordion-header:hover:after {background-color: white;}
.accordion-header:before, .accordion-header:after {background-color: #fff;content: '';display: block;position: absolute;z-index: 3;}
.accordion-header:before {height: 1px;margin-top: 0px;top: 50%;right: 20px;width: 13px;}
.accordion-header:after {height: 13px;margin-top: -2px;top: 43%;right: 26px;width: 1px;}
.accordion input:checked ~ .accordion-header {color: white;background: rgba(0, 0, 0, .3);
  border-radius: 10px;}
.accordion input:checked ~ .accordion-header:hover {color: white;}
.accordion input:checked ~ .accordion-header:before {background-color: white;}
.accordion input:checked ~ .accordion-header:after {display: none;}
.accordion-content {display: none;font-size: 16px;margin-bottom: 50px;}
.accordion-content h4{line-height: 3; font-weight: 500;}
.accordion input:checked ~ .accordion-content {display: block;}
.download-logo img{display: inline-block;height: 50px; }
.download-logo a{border-bottom: 0px !important;}

/*tutorial*/
nav{overflow: hidden;height: 60px;padding: 7px 0;}
ul.menu {text-align: center; list-style: none;white-space: nowrap;overflow-x: auto; -webkit-overflow-scrolling: touch;}
ul.menu li {background: rgba(0, 0, 0, .3);width: 140px;border-radius: 100px;display: inline-block;transform: translateX(-30px);
  animation: slideInRight 0.6s ease-out forwards;}
li.menu_active{background: #3E1EE6!important;}
ul.menu>li>a {display: block;padding: 6px 0;text-align: center;position: relative;animation-delay: 0.1s;}
.layout-container {display: flex;flex-direction: column;gap: 24px;background: #231A54;}
.flow-info {flex: 1;order: 1;margin: 0 15px 20px;}
.iframe-wrapper {width: 100%;max-width: 300px;margin: 0 auto;overflow: hidden;margin-top: 20px;order: 2;}
.iframe-scaler {transform-origin: top left;display: inline-block;}
.step_style{font-size: 28px;opacity: .5;letter-spacing: .1em;}
.note_style{font-size: 14px;}
.flow-info section{margin-top: 50px;}
.switch_windows{display: none;}
.switch_mobile{display: block; text-align: center; margin-top: 50px;margin-bottom: -30px; font-size: 24px;}

/*notify*/
.doc_table {padding: 50px 0;}
.doc_table table{width: 100%;}
.doc_table td, .doc_table th{padding: 15px;}
.doc_table td:first-child{font-size: 18px;font-weight: 500;}
.doc_table td:first-child, .doc_table th:first-child{width: 80%;}
.doc_table td:last-child{text-align: center;}
.doc_table th:first-child{text-align: left;}
.doc_table tr:nth-child(even){background: rgba(0,0,0,.3);}
.doc_table td:first-child::after{content:"";background: url(../images/ic_download.svg) no-repeat center;display: inline-block;width: 20px;height: 20px;background-size: contain;position: relative;top: 3px;left: 5px;}

/*pizza day*/
.pizzaday_title{display: none;}
.pizzaday_title_m{margin-bottom: 50px;}
.bitcoiin_content, .campaign_content{padding: 10px 15px;letter-spacing: 0.05em;}
.campaign_content{margin-top: 100px;}
.bitcoiin_content{margin-bottom: 40px;text-align: center;}
.bitcoiin_content h1, .campaign_content h1{font-size: 28px;text-align: center;line-height: 1.6;margin-bottom: 20px;}
.bitcoiin_content .modal {background: rgba(0, 0, 0, .9);height: 1px;overflow: hidden;position: fixed;top: 50%;left: 50%;transform: translate(-50%, -50%);transition: width 0.5s ease 0.5s, height 0.5s ease;width: 0;}
.bitcoiin_content .content {color: transparent;font-family: sans-serif;font-size: 2em;position: absolute;top: 50%;text-align: center;transform: translate3d(0, -50%, 0);transition: color 0.5s ease;width: 100%;}
.bitcoiin_content label {color: #fff;cursor: pointer;font-family: sans-serif;font-size: 24px;padding: 15px 5px; width: 45%;display: inline-block;text-align: center;border: 1px solid #fff; border-radius: 10px; background: rgba(0, 0, 0, .3);margin-bottom: 20px;}
.bitcoiin_content input {cursor: pointer;height: 0;opacity: 0;width: 0;}
.bitcoiin_content input:focus {outline: none;}
.bitcoiin_content input:checked {height: 40px;opacity: 1;position: fixed;right: 44%;bottom: 10%;z-index: 1; width: 40px;z-index: 9999;}
.bitcoiin_content input:checked::after, input:checked:before {border-top: 2px solid #FFF;content: "";display: block;position: absolute;top: 50%;transform: rotate(45deg);width: 100%;}
.bitcoiin_content input:checked::after {transform: rotate(-45deg);}
.bitcoiin_content input:checked + label {color: #FFF;transition: color 0.5s ease;}
.bitcoiin_content input[id="button_birth"]:checked ~ #modal01, 
.bitcoiin_content input[id="button_pizzaday"]:checked ~ #modal02, 
.bitcoiin_content input[id="button_now"]:checked ~ #modal03, 
.bitcoiin_content input[id="button_funfact"]:checked ~ #modal04 {height: 100%;width: 100%;transition: width 0.5s ease, height 0.5s ease 0.5s;z-index: 999;}
.bitcoiin_content input[id="button_birth"]:checked ~ #modal01 .content, 
.bitcoiin_content input[id="button_pizzaday"]:checked ~ #modal02 .content,
.bitcoiin_content input[id="button_now"]:checked ~ #modal03 .content, 
.bitcoiin_content input[id="button_funfact"]:checked ~ #modal04 .content {color: #FFF;transition: color 0.5s ease 0.5s;}
.campaign_content .c1, .campaign_content .c2, .campaign_content .c3{margin: 25px auto;}
.bitcoiin_content h2{font-size: 20px;margin-bottom: 20px;}
.m_content{padding: 20px 15px;font-size: 18px;}
.btc_identify{border-spacing: 0;margin: 20px auto; border: 1px solid #fff; }
.btc_identify td{border: 1px solid #fff;height: 60px;}
.btc_identify img{padding: 20px;}
.m_content{height: 85vh;overflow: auto;}
.m_content h1{margin-top: 20px;}
.m_content ul li{line-height: 1.8;text-align: left;}
.m_content p {padding-left: -2em;text-indent: 2em;text-align: left;}
.modal01_content h2{font-size: 28px;}
.modal04_content ul li{padding: 10px 0;}
.c1 p:first-child,.c2 p:first-child,.c3 p:first-child{text-align: center; margin: 30px auto;}

@media (min-width: 768px) {
    .layout-container {flex-direction: row;align-items: flex-start;justify-content: space-between;margin-top: 40px;}
    .iframe-wrapper {flex: 1;position: sticky;top: 40px; align-self: flex-start;order: 1;}
    .flow-info {flex: 1;order: 2;margin: 20px 40px 40px;}
    .flow-info h2{margin-top: 0;font-size: 34px;}
    .flow-info p{font-size: 18px;}
    .doc_table {padding: 50px 20px;}
    .doc_table {width: 900px;margin: 0 auto;}
    .switch_windows{display: block;}
    .switch_mobile{display: none;}
    .pizzaday_title{display: block;margin-bottom: 50px;}
    .pizzaday_title_m{display: none;}
    .bitcoiin_content input:checked {right: 50%;}
    .campaign_content{padding: 20px;}
    .bitcoiin_content h1, .campaign_content h1{font-size: 40px;margin-top: 20px;}
    .campaign_content .c1 img, .campaign_content .c2 img, .campaign_content .c3 img{width: 720px;}
    .campaign_content{text-align: center;margin-top: 50px;}
    .campaign_content p, ol li{text-align: left;font-size: 18px; line-height: 1.8;}
    .btc_identify{border-spacing: 0;max-width: 700px;}
    .btc_identify img{padding: 30px;}
    .modal01_content section{width: 90%; margin: 0px auto;padding: 40px;overflow: hidden;}
    .modal01_content section h2{text-align: left;}
}

@media (min-width: 768px) and (max-width: 1199px) {
    .wrapper{grid-template-columns: 50%;}
    .navlogo {padding: 10px 25px 15px;}
    .box{width: 100%;}
    #box1{grid-column: 1 / 3}
    #box2{grid-column: 1 / 3}
    #box3{grid-column: 1 / 3}
    #box4{grid-column: 1 / 3}
    #box7{grid-column: 1 / 3}
    .crypto_info{display: flex;}
    .crypto_block{width: 50%;margin:0 15px 40px;}
    .container{padding: 20px;}   
}

@media (min-width: 1200px) {
    body{background: #190e62 url(../images/img_bg.png) no-repeat top left;background-size: 100%;}
    .wrapper{grid-template-columns: 1fr 1fr 1fr 1fr;grid-template-rows: 280px 140px 140px;/*height: 80vh;*/}
    .navlogo {padding: 10px 25px 15px;}
    #box1{grid-column: 1 / 3;}
    #box2{grid-column: 3; grid-row: 1 / 4;overflow: visible;padding: 0;position: relative;height: auto;}
    #box3{grid-column: 4;height: auto;}
    #box4{grid-column-start: 2;grid-column: 1;grid-row: 2 / 4;height: auto;padding: 10%;}
    #box5{grid-column-start: 2;height: auto;}
    #box6{grid-column-start: 2;height: auto;}
    #box7{grid-column-start: 4;grid-row-start: 2;grid-row: 2 / 4;height: auto;padding: 10%;}

    /*box1*/
    .d-title{width: 70%;}
    .download img{height: 40px;}
    /*#box1 > h2 {margin: -50px auto 80px 31%;}*/
    
    
    /*box2*/
    #box2 > img{margin-top: -60px;}
    .linksection{padding: 5%;background:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0) 60%); position: absolute;bottom: 0;width: 100%;padding-bottom: 110px;}
    
    
    /*box4*/
    #box4 a{background: url(../images/img_box4.svg) no-repeat top left;background-size: 80%;}
    #box4 a:before{transform: rotate(180deg);position: relative;top: 180px;width: 100%;}

    .crypto_info{display: flex;}
    .crypto_block{width: 50%;margin:0 15px 40px;}

    .iframe-wrapper{margin-left: 150px;}
    .flow-info {margin: 20px 80px 40px;}

    /*pizzaday*/
    .bitcoiin_content label {width: 22%;display: inline-block;}
    .bitcoiin_content > label:nth-child(9){margin-left: 25px;}    
}

@media (min-width: 1900px) {
  .wrapper{max-width: 1645px;margin: 5% auto 3%;}
}