@charset "UTF-8";
html {line-height: 1;-webkit-text-size-adjust: 100%;}body {margin: 0;}main {display: block;}h1 {font-size: 2em;margin: 0.67em 0;}hr {box-sizing: content-box;height: 0;overflow: visible;}pre {font-family: monospace, monospace;font-size: 1em;}a {background-color: transparent;}abbr[title] {border-bottom: none;text-decoration: underline;text-decoration: underline dotted;}b, strong {font-weight: bolder;}code, kbd, samp {font-family: monospace, monospace;font-size: 1em;}small {font-size: 80%;}sub, sup {font-size: 75%;line-height: 0;position: relative;vertical-align: baseline;}sub {bottom: -0.25em;}sup {top: -0.5em;}img {border-style: none;}button, input, optgroup, select, textarea {font-family: inherit;font-size: 100%;line-height: 1.15;margin: 0;}button, input {overflow: visible;}button, select {text-transform: none;}button, [type="button"], [type="reset"], [type="submit"] {-webkit-appearance: button;}button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner {border-style: none;padding: 0;}button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring {outline: 1px dotted ButtonText;}fieldset {padding: 0.35em 0.75em 0.625em;}legend {box-sizing: border-box;color: inherit;display: table;max-width: 100%;padding: 0;white-space: normal;}progress {vertical-align: baseline;}textarea {overflow: auto;}[type="checkbox"], [type="radio"] {box-sizing: border-box;padding: 0;}[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button {height: auto;}[type="search"] {-webkit-appearance: textfield;outline-offset: -2px;}[type="search"]::-webkit-search-decoration {-webkit-appearance: none;}::-webkit-file-upload-button {-webkit-appearance: button;font: inherit;}details {display: block;}summary {display: list-item;}template {display: none;}[hidden] {display: none;}
/*fontawesome*/
/*fontawesome end*/
@media only screen and (min-width: 960px) {
    .m{display: none;}
}
@media only screen and (max-width:959px){
    .d{
        display: none;
    }
    }
#wrapper{
    width: 100%;
    overflow-x: hidden;
}
#wrapper #header{
    width:100%;
    background: #dcdddd;
}
#wrapper #header .menu_wrapper{
    width:1200px;
    margin:0 auto;
    position: relative;
    display: flex;
}
@media only screen and (min-width: 960px) {
    #wrapper #header .menu_wrapper{
        justify-content: center;
    }
}
@media only screen and (max-width:959px){
    #wrapper #header .menu_wrapper{
        width: 100%;
        justify-content:space-between;
    }
}
#wrapper #header .logo{
    width: 166px;
    position:relative;
    margin:10px;
}
@media only screen and (max-width: 959px) {
    #wrapper #header .logo{
        position: relative;
        width:100px;
        right:0%;
        z-index: 50;
    }
}
#wrapper {
    /*background: rgb(103,13,18);
    background: linear-gradient(45deg, rgba(103,13,18,1) 50%, rgba(177,49,45,1) 100%);*/
}
#wrapper #KV{
    width:100%;
    margin:0 auto;
    /*background: url("../images/KV.png") no-repeat center 5rem;
    background-size: 45%;*/
    background: url("https://storage.googleapis.com/wwwpkcard/evoucher221028/images/header_bg.jpg") no-repeat center 0;
    background-size:cover;
    padding:4rem 0 0 0;
}

    #wrapper #KV .KV{
        width: 100%;
        margin:0 auto;
        
    }
    #wrapper #KV .KV img{
        margin:0 auto;
        display: block;
    }
@media only screen and (max-width:959px){
    #wrapper {
        background: rgb(103,13,18);
        background: linear-gradient(15deg, rgba(103,13,18,1) 80%, rgba(177,49,45,1) 100%);
    }
    #wrapper #KV{
        padding:1rem 0 0;
        background: url("https://storage.googleapis.com/wwwpkcard/evoucher221028/images/header_bg.jpg") no-repeat center 0;
        background-size:cover;
    }
    #wrapper #KV .KV{
        margin:8vh auto 0;
/*        background: url("../images/pizza_m.png") no-repeat bottom right;*/
        background-size: 58%;

    }
    #wrapper #KV .KV .CTA{
        width: 55%;
    }
    #wrapper #KV .KV img{
        width: 100%;
        margin:2rem auto 0;
    }
    #wrapper #KV .KV .pizza{
        width: 75%;
        display: block;
        margin-left: auto;
    }
}
#wrapper #gift{
    width:100%;
    padding:1em 0;
    background:url(https://storage.googleapis.com/wwwpkcard/evoucher221028/images/gift_bg.jpg) no-repeat center 0;
    background-size: cover;
}
@media (min-width:1940px) and (max-width:2640px){
    #wrapper #gift{ background:url(https://storage.googleapis.com/wwwpkcard/evoucher221028/images/gift_bg.jpg) no-repeat center 100%;
        background-size: cover;
    }
}
    #wrapper #gift .d img{
        display: block;
        margin: 0 auto;
    }
    #wrapper #gift .title{
        display: block;
        margin: 1rem auto 0rem;
        width:fit-content;
    }
        #wrapper #gift h2{
            text-align: center;
            line-height: 85%;
            font-size: 1.5rem;
        }
    #wrapper #gift .box{
        display: flex;
        justify-content: center;
        padding: 0 0 1rem 0;        
        width:90vw;
        margin: 0 auto;
    }
        #wrapper #gift .box .d{
            margin:0 0 0 -8rem;
        }
        #wrapper #gift .box .arrow{
            width: 125px;
            height: 68px;
            margin:5rem 0 0 -10rem;
            position: relative;
            z-index: 101;
        }
        #wrapper #gift .box >img{
            width:32%;
        }
        #wrapper #gift .box .content{
            background: #c30d23;
            border-radius: 1.5rem;
            width: 33vw;
            height: 50%;
            color:#fff;
            padding: 1.5rem 1.5rem 0;
            
            margin:2rem 0 0 0;
            flex-grow: 0;
            flex-shrink: 0;
            flex-basis: 40%;
        }
        #wrapper #gift .box > img:nth-of-type(1){
            flex-grow: 0;
            flex-shrink: 0;
            flex-basis: 40%;
            height: 100%;
            
            
        }
        #wrapper #gift .box .content > img{
            display: block;
            margin: 0 auto;
            width: 45%;
        }
        #wrapper #gift .box .content p{
            font-size: 1rem;
            line-height: 1.8rem;
            text-justify: auto;
        }
        #wrapper #gift .box .content ul{
            list-style: none;
            padding:0;
        }
        #wrapper #gift .box .content ul li{
            display: flex;
            align-items: center;
            width: 100%;
            min-height: 8rem;
            padding:0 1.5%;
            margin:1% 0;
            background: #cf3d4f;
        }
        #wrapper #gift .box .content ul li .text {
            padding:1.5rem;
        }
        #wrapper #gift .box .content ul li img{
            
        }
                #wrapper #gift .box .content ul li .text h4{
                    font-size: 1rem;
                    line-height: 1.25rem;
                    margin:0;
                    padding:0;
                    font-weight: bold;
                }
                #wrapper #gift .box .content ul li .text p{
                    font-size: 0.8rem;
                    line-height: 1.2rem;
                }
@media only screen and (max-width:959px){
    #wrapper #gift{
        width:100%;
        padding: 0;
    }
    #wrapper #gift .m img{
        width:100%;
    }
            #wrapper #gift img{
                width:fit-content;
                margin:0 auto;
            } 
            #wrapper #gift h2{
                text-align: center;
                line-height: 85%;
                font-size: .85rem;
            }
            #wrapper #gift .box{
                display: block;
            }
            #wrapper #gift .box .content{
                background: #c30d23;
                border-radius: 1.5rem;
                flex-grow: 0;
                flex-shrink: 0;
                color:#fff;
                width: 100%;
                padding: 1.5rem 1.5rem 0;
                height: 50%;
            }
            #wrapper #gift .box .content p{
                font-size: 1rem;
                line-height: 1.5rem;
                text-justify: auto;
            }
            #wrapper #gift .box .content > img{
                width:85%;
            }
            #wrapper #gift .box .content ul li{
                background: #cf3d4f;
            }
            #wrapper #gift .box .content ul li .text h4{
                font-size: 1.2rem;
                line-height: 1.8rem;
                margin:0;
                padding:0;
                font-weight: bold;
            }
            #wrapper #gift .box .content ul li .text p{
                font-size: 1rem;
                line-height: 1.5rem;
            }
}
    #wrapper #use{
        width: 100%;
        background: #efefef url(https://storage.googleapis.com/wwwpkcard/evoucher221028/images/use_bg.png) no-repeat center 0;
        padding:2rem 0;
    }
    #wrapper #use .title{
        margin:0 auto;
        display: block;
    }
            #wrapper #use .title img{
                display: block;
                margin:0 auto;
            }   
            #wrapper #use .title h1{
                font-size:2.5rem;
                text-align: center;
                width:fit-content;
                margin:2rem auto;
                color:#d7142d;
                font-weight: 900;
                border-bottom:6px solid #d7142d;
            }
    #wrapper #use .steps{
        display: flex;
        width: 1366px;
        margin: 0 auto;
        justify-content:center;
        padding:0;
    }
        #wrapper #use .steps > li{
            list-style: none;
            color:#fff;
            padding:0.5rem;
            width: 24%;

        }
            #wrapper #use .steps li > p{
                font-size: 1.5rem;
                line-height: 1.8rem;
                width:100%;
                height: 6rem;
                text-align: center;
                padding:0 0 2rem;
                color:#d7142d;
                font-weight: 800;
            }
            #wrapper #use .steps li img{
                
                vertical-align: bottom;
                margin:0 auto;
                
            }
            #wrapper #use video{
                width:100%;
                max-width: 960px;
                margin:2rem auto;
                display: block;
            }
            #wrapper #use .video .clip{
                width:fit-content;
                margin:1rem auto;
            }
            #wrapper #use .steps li .split{
                display: flex;
            }
                #wrapper #use .steps li .split p{
                    font-size: 1rem;
                    background:#231815;
                    color:#fff;
                    border-radius:1rem;
                    line-height: 1.5rem;
                    text-align: center;
                    margin:0 0rem 0.5rem;
                    padding:0 0.2rem;
                }
                #wrapper #use .steps li .split img{
                    margin:0 0.5rem;
                }
            #wrapper #use .steps li p,  #wrapper #use .steps li img{
                display: block;
                margin:0 auto;
            }
            #wrapper #use .CTA{
                display: block;
                margin:0 auto;
                width:fit-content;
            }
    @media only screen and (max-width:959px){
        #wrapper #use{
            padding:1rem 0;
        }
        #wrapper #use .title{
            margin:0 auto;
            display: block;
            width:100%;
        }
        #wrapper #use .title h1{
            font-size: 1.5rem;
            text-align: center;
                width:fit-content;
                margin:2rem auto;
            white-space:nowrap;
            border-bottom:3px solid #d7142d;
        } 
        #wrapper #use .title img{
            display: block;
            margin:0 auto;
            width: 100%;
        }  
        #wrapper #use .steps{
            display: block;
            width: 100%;
            margin: 0 auto;
            height:100%;
            padding:0;
        } 
        #wrapper #use .steps li{
            list-style: none;
            color:#fff;
            padding:0 0 1rem;
            width:100%;
        }
        #wrapper #use .steps li img{
            width:70%;
            margin:0 auto;
        }
        #wrapper #use .steps li > p{
            font-size: 1.5rem;
            line-height: 1.2rem;
            width:80%;
            margin:0 auto;
            padding:0 0 2rem;
        }
        #wrapper #use video{
            width:95%;
            max-width: 960px;
            margin:2rem auto;
            display: block;
        }       
        #wrapper #use .steps li p,  #wrapper #use .steps li img{
            display: block;
            margin:0 auto;
        }
    }
    #wrapper #dl_app{
        width:100%;
        background: #C30D23;
        padding:0;
        margin:0;
        line-height: 0;
    }
        #wrapper #dl_app img{
            display: block;
            margin:0 auto;
            width:100%;
        }
        #wrapper #dl_app .title{
            display: block;
            margin: 1rem auto 2.5rem;
            width:fit-content;
        }
        #wrapper #dl_app > ul{
            list-style: none;
            display: flex;
            width:1200px;
            margin: 0 auto;
            justify-content: center;
            padding:1rem 0;
            
        }
            #wrapper #dl_app ul > li{
                padding:1rem 0;
                display: flex;
                flex-direction: column;
                width:50%;
            }
            #wrapper #dl_app ul li p{
                display: inline;
                width:16rem;
                margin:0 auto;
                text-align: center;
                font-size: 1.5rem;
                line-height: 2.2rem;
                font-weight: 1000;
            }
            #wrapper #dl_app ul li img{
                display: inline;
                margin:1.2rem auto;
            }
            #wrapper #dl_app ul li ul{
                padding:1rem 0;
                display: flex;
                justify-content: center;
                align-items: center;
            }
            #wrapper #dl_app ul li ul li img{
                display: block;
                margin:0 auto;
            }
    @media only screen and (max-width:959px){
        #wrapper #dl_app .title{
            width:85%;
            margin: 1rem auto 2.5rem;
        }
        #wrapper #dl_app .title img{
            width:68%;
            display: block;
            margin:0 auto;
        }
        #wrapper #dl_app > ul{
            list-style: none;
            display: flex;
            width:100%;
            margin: 0 auto;
            
            flex-direction: column-reverse;
            padding:1rem 0;
            
        }
            #wrapper #dl_app > p{
                width:fit-content;
                margin:0 auto;
                text-align: center;
                font-size: 1.25rem;
                line-height: 1.8rem;
                font-weight: 1000;
            }
            #wrapper #dl_app ul > li{
                padding:1rem 0;
                width:90%;
                margin:0 auto;
            }
            
            #wrapper #dl_app ul li p, #wrapper #dl_app ul li .d{
                display: none;
            }
            #wrapper #dl_app ul > li img{
                width: 100%;
                padding:1%;
            }
            
    }
    #wrapper #feature{
        width:100%;
        background: #000;
        padding:2rem 0 ;
        color: #fff;
    }
    #wrapper #feature .ext{
        width:1050px;
    }
        #wrapper #feature h2{
            font-size: 2.25rem;
            width:1200px;
            margin: 0 auto;
        }
        #wrapper #feature h2 .sp{
            width:425px;
            display: inline-block;
            letter-spacing:.3rem;
        }
        #wrapper #feature .ext{
            font-size: 2.25rem;
            width:1180px;
            margin: 0 auto;
        }
        .ext:after {
			content: "";
			height: 3px;
			width: 60%;
			background-color: #fff;
			margin: -5px 15px 0 15px;
			display: inline-block;
			vertical-align: middle;
		}
		.separate:after {
			content: "";
			height: 3px;
			width: 60%;
			background-color: #fff;
			margin: -5px 15px 0 15px;
			display: inline-block;
			vertical-align: middle;
		}
        #wrapper #feature .member{
            width:1200px;
            margin: 0 auto;
            display: flex;
            justify-content: space-around;
        }
        #wrapper #feature .member ul{
            padding:0;
            list-style: none;
        }
            #wrapper #feature .member ul li{
                font-size: 1rem;
                line-height: 3.5rem;
            }
                #wrapper #feature .member ul li em{
                    background: #c30d23;
                    margin:0 1.5rem 0 0;
                    padding:0.15rem 1rem;
                    font-style: normal;
                }
                
                #wrapper #feature .member ul .uni{
                    
                    /*content:"\A";
		            white-space: pre;*/
                }
                    #wrapper #feature .member ul .uni em{
                        display: inline-block;
                        vertical-align: middle;
                        line-height: 1.8rem;
                    }
                    #wrapper #feature .member ul .uni ul{
                        display: inline-block;
                        vertical-align: top;
                        line-height: 0.8rem;
                    }
        #wrapper #feature ol{
            width:1200px;
            margin: 0 auto;
            padding:1rem 0 1rem 8.5rem;
        }
            #wrapper #feature ol li{
                line-height: 2.2rem;
                font-size: 1rem;
            }
        
    @media only screen and (max-width:959px){
        #wrapper #feature{
            width:100%;
            background: #000;
            padding:2rem 2.5% ;
            color: #fff;
        }
           
    }
    #wrapper .note{
        padding:0;
        margin:0;
        line-height: 0;
    }
    #wrapper .note img{
        width:100%;
        
    }
    footer{
        width: 100%;
        height: 4rem;
        background: #c30d23;
        color:#fff;
        font-size: 1rem;
        line-height: 4rem;
        text-align: center;
        padding:0;
        margin:0;
    }
        footer p{
            padding:0;
            margin:0;
        }
        @media only screen and (max-width:959px){
            footer{
            font-size: 0.75rem;
            line-height: 2.5rem;
            height: 2.5rem;
            padding: 0;
            margin:0;
            }
        }