@charset "utf-8";
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
button,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
video,
input,
textarea {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font-family: 'Malgun Gothic', AppleSDGothicNeo, 'Gulim', Arial, sans-serif;
  vertical-align: baseline;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  word-break: normal;
  word-wrap: break-word;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}
html {
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}
body {
  min-width: 320px;
  line-height: 1;
}
ul {
  list-style: none;
}
select,
input,
textarea {
  border: 0;
  -webkit-border-radius: 0;
  border-radius: 0;
  -webkit-appearance: none;
  -webkit-box-shadow: none;
  box-shadow: none;
  background: none;
  outline: 0;
}
blockquote,
q {
  quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
  content: '';
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
a {
  text-decoration: none;
}
img {
  vertical-align: top;
}
button {
  background: none;
  border: none;
}
body{
  overflow-x: hidden;  
}
body.scroll-hidden{
  overflow: hidden;
}
.toon-info-wrap {
  overflow: hidden;
  width: 100%;
  height: 100%;
}
.toon-info-wrap:after{
  overflow: hidden;
  content: '';
  display: block;
  clear: both;
  width: 100%;
}

.parallax-container {
  overflow: hidden;
}
.parallax-container:after{
  overflow: hidden;
  content: '';
  display: block;
  clear: both;
}
.toon-info {
  overflow: hidden;
  position: relative;
  width: 100%;
}
.toon-info:after{
  overflow: hidden;
  content: '';
  display: block;
  clear: both;
  width: 100%;
}
.toon-info .btn-wrap{
  position: fixed;
  bottom:40px;
  right: 2%;
  z-index: 100;
}
.toon-info .btn-wrap .btn-scroll,
.toon-info .btn-wrap .btn-top{
  display: none;
  width: 72px;
  height:72px;
  background-repeat: no-repeat;
  background-size: cover;
  text-indent: -999999px;
}
.toon-info .btn-wrap .btn-scroll.active,
.toon-info .btn-wrap .btn-top.active{
  display: block;
}
.toon-info .btn-wrap .btn-scroll{
  background-image: url(images/btn-scroll.svg);
}
.toon-info .btn-wrap .btn-top{
  background-image: url(images/btn-top.svg);
}
.toon-info-header {
  width: 100%;
  background: url(images/bg-skyblue.svg) no-repeat bottom center;
  background-size: cover;
  text-align: center;
}
.toon-info .gnb-bi-img{
  /*position: fixed;*/
  position: absolute;
  top:40px;
  left: 50%;
  transform: translateX(-50%);
  margin-left: -300px;
  display: block;
  z-index: 20;
}
.toon-info .gnb-bi-img img{
  width: 160px;
}
.toon-info-header {
  position: relative;
  min-height: 972px;
}
.toon-info .toon-info-header-tit{
  position: absolute;
  top:104px;
  left: 50%;
  width:400px;
  height:214px;
  transform: translateX(-50%);
  background: url(images/img-title-01.svg) no-repeat 0 0;
  background-size: 400px auto;
  z-index: 10;
}
.toon-info-header .toon-info-cloud-right,
.toon-info-header .toon-info-cloud-left,
.toon-info-header .toon-info-right-bottom{
  /*animation:cloud-mov 2s linear 0.5s infinite;*/
  transition: 1s;
}
.toon-info .toon-info-cloud-right{
  position: absolute;
  top:50px;
  right: 170px;
  animation-delay: 2s;
}
.toon-info .toon-info-cloud-left{
  position: absolute;
  top:100px;
  left: 265px;
  animation-delay: 2.3s;
}
.toon-info .toon-info-right-bottom{
  position: absolute;
  top:370px;
  right: -7%;
  z-index: 10;
}
  @keyframes cloud-mov {
    0%  {}
    50% {margin-top:10px}
    100% {}
  }
  .toon-info .toon-info-gift{
  position: absolute;
  top:350px;
  left: 50%;
  transform: translateX(-50%);
  margin-left: -200px;
  animation:gift-mov 5s ease-in-out 0.5s infinite;
  }
  .toon-info .toon-info-gift .toon-info-gift-character{
  position: relative;
  display: block;
  /*width:517px;
  height:513px;*/
  width:490px;
  height:486px;
  background: url(images/img-character-center.png) no-repeat 0 0;
  background-size: 490px auto;
  z-index: 1;
  animation:gift-mov 5s ease-in-out 0.5s infinite;
}
.toon-info .toon-info-header-tit:after{
  content: '';
  position: absolute;
  top: 425px;
  left: 250px;
  width: 121px;
  height: 110px;
  background: url(images/img-subtext-01.svg) no-repeat;
  background-size: 121px auto;
}
.toon-info .toon-info-gift:before{
  content: '';
  position: absolute;
  top: 5px;
  left: 100px;
  width: 200px;
  height: 114px;
  background: url(images/img-bubble-01-back.svg) no-repeat;
  background-size: 160px auto;
  z-index: 0;
}
.toon-info .toon-info-gift:after{
  content: '';
  position: absolute;
  top: -150px;
  left: 40px;
  width: 390px;
  height: 243px;
  background: url(images/img-bubble-01-front.svg) no-repeat;
}
.toon-info .toon-info-gift2{
  position: absolute;
  top:500px;
  left: 50%;
  width:200px;
  height:237px;
  margin-top:350px;
  transform: translateX(-50%);
  background: url(images/img-present-01.png) no-repeat 0 0;
  background-size: 200px auto;
  margin-left: 100px;
  z-index: 10;
}
.toon-info .toon-info-gift2:after{
  content: '';
  position: absolute;
  top: -80px;
  left: -80px;
  width: 324px;
  height: 325px;
  background: url(images/img-bubble-02-front.svg) no-repeat;
  background-size: 280px auto;
  z-index: 1;
}
.toon-info .toon-info-gift3{
  position: absolute;
  top:1070px;
  left: 50%;
  width:239px;
  height:254px;
  transform: translateX(-50%);
  background: url(images/img-present-02.png) no-repeat 0 0;
  background-size: 239px auto;
  margin-left: -50px;
  z-index: 10;
}
@keyframes gift-mov {
  0%  {}
  50% {margin-top:30px}
  100% {}
}
.toon-info-container {
  position: relative;
  width: 1184px;
  min-height: 1000px;
  margin: 0 auto;
  transition: 1s;
}
.toon-info .toon-info-frame-wrap{
  position: relative;
  display: block;
}
.toon-info .toon-info-frame-wrap:after{
  content: '';
  display: block;
  clear: both; 
}
.toon-info .toon-info-frame{
  position: absolute;
  display: block;
  width:1739px;
  height:854px;
  margin:0 auto;
  margin-left: -330px;
  background: url(images/img-frame-01-bg.svg) no-repeat 0 0;
  background-size: 1739px auto;
  z-index: 2;
}
.toon-info .toon-info-frame:after{
  content: '';
  position: absolute;
  top: 200px;
  left: 405px;
  width: 123px;
  height: 106px;
  background: url(images/img-subtext-02.svg) no-repeat;
  background-size: 123px auto;
  transition: 0.5s;
}
.toon-info .toon-info-frame:before{
  content: '';
  position: absolute;
  top: 730px;
  left: 905px;
  width: 274px;
  height: 80px;
  background: url(images/img-title-02.svg) no-repeat;
  background-size: 274px auto;
  transition: 0.5s;
}
.toon-info .toon-info-frame-bg{
  position: absolute;
  top:170px;
  left: 220px;
  display: block;
  width:904px;
  height:528px;
  margin:0 auto;
  background: url(images/img-frame-01-bg.png) no-repeat 0 0;
  background-size: 664px auto;
  z-index: 1;
}
.toon-info .toon-info-gift-character2{
  position: absolute;
  top:100px;
  left: 680px;
  display: block;
  width:359px;
  height:516px;
  margin:0 auto;
  background: url(images/cha-02.png) no-repeat 0 0;
  background-size: 359px auto;
  z-index: 10;
  transition: 0.5s;
}
/*video*/
.video{
  overflow: hidden;
  position: relative;
  width: 100%;
  min-height: 790px;
}
.video-wrap,
.video .video-wrap{
  /*overflow: hidden;*/
  position: relative;
  width: 50%;
  height: 50%;
  max-width: 1920px;
  margin:0 auto;
  background-image: url(images/video-bg.png);
  /*transform: translateX(50%);*/
  background-position: 0 0;
  background-size: cover;
  opacity: 1;
  transition: 0.5s;
}
.video video {
  min-width : 50%;
  min-height : 50%;
  width : 100%;
  height : 100%;
  background-position: center center;
  z-index : -1;
  /*transform: translateX(50%);
  filter:opacity(100%);*/
  opacity: 0.9;
  /*transition: 0.7s;
  animation-delay: 0.5s;*/
}
.video.active {
  width: 100%;
  height: 100%;
  
  /*
  margin-left: 50%;
  transform: translateX(-50%);*/
}
.video.active .video-wrap{
  width: 100%;
  height: 100%;
  margin:0 auto;
  transform: translateX(0%)
}
.video.active video{
  width : 100%;
  height : 100%;
  margin:0 auto;
  /*transform: translateX(50%);
  transform: translateX(100%);*/
}

/*
.video-wrap:after{
  content:""; 
  display:block; 
  clear:both;
  position: absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background-size: cover;
  background-color:#414141;
  background-image: url();
  background-size: cover; #302B14
  opacity: 0.6;
  z-index: 1;
}*/
.video .video-txt{
  display: none;
  position: absolute;
  top: 100px;
  left: 50%;
  width: 292px;
  height: 246px;
  background: url(images/img-title-03.svg) no-repeat;
  background-size: 292px auto;
  transform: translateX(-50%);
  margin-left: -200px;
  z-index: 2;
}
.video .btn-wrap{
  position: absolute;
  top: 50%;
  left: 50%;
  display:none;
  width: 100px;
  height: 100px;
  transform: translate(-50%,-50%);
  z-index: 10;
}
.video .btn-wrap .btn-play,
.video .btn-wrap .btn-pause{
  position: absolute;
  top:0;
  left: 0;
  display: none;
  width: 100px;
  height:100px;
  background-repeat: no-repeat;
  background-size: cover;
  opacity: 0;
  transition: 0.5s;
}
.video .btn-wrap .btn-play{
  background-image: url(images/btn-play.svg);
}
.video .btn-wrap .btn-pause{
  background-image: url(images/btn-pause.svg);
}
.video:hover .btn-wrap .btn-play.active,
.video:hover .btn-wrap .btn-pause.active{
  display: none;
  opacity: 0.9;
}

.banner-wrap{
  position: relative;
  overflow: hidden;
  height: 1067px;
}
.banner-wrap:after{
  content: '';
  display: block;
  clear: both;
}
.banner-wrap .banner-tit{
  position: absolute;
  top:155px;
  left: 50%;
  width:100%;
  height: 64px;
  background: url(images/img-title-04.svg) no-repeat center center;
  background-size: auto 64px;
  transform: translate(-50%,-50%);
  text-indent: -999999px;
  z-index: 10;
}
.banner-wrap .swiper-container {
  position: relative;
  width: 100%;
  height: 100%;
}
.banner-wrap .swiper-slide {
  text-align: center;
  font-size: 18px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  background-color: #fff;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
}
.banner-wrap .swiper-bg1 {
  background: url(images/img-bg-01.svg) repeat 0 0;
}
.banner-wrap .swiper-bg2 {
  background: url(images/img-bg-02.png) repeat 0 0;
}
.banner-wrap .swiper-bg3 {
  background: url(images/img-bg-03.png) repeat 0 0;
}
.banner-wrap .swiper-bg1,
.banner-wrap .swiper-bg2,
.banner-wrap .swiper-bg3 {
  position: relative;
  top:0;
  right:0;
  bottom:0;
  right:0;
  width: 100%;
  height:100%;
  background-repeat: repeat-x;
  background-position: 0 center;
  background-size: auto auto;
}
/*.banner-wrap .swiper-slide.swiper-slide-active .swiper-bg2,
.banner-wrap .swiper-slide.swiper-slide-active .swiper-bg3,*/
.banner-wrap .swiper-slide.swiper-slide-active .swiper-bg1
{
  animation-name: swiper-bg;
  animation-duration: 120s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}
.banner-wrap .swiper-slide.swiper-slide-prev .swiper-bg1,
.banner-wrap .swiper-slide.swiper-slide-prev .swiper-bg2,
.banner-wrap .swiper-slide.swiper-slide-prev .swiper-bg3,
.banner-wrap .swiper-slide.swiper-slide-next .swiper-bg1,
.banner-wrap .swiper-slide.swiper-slide-next .swiper-bg2,
.banner-wrap .swiper-slide.swiper-slide-next .swiper-bg3{
  opacity: 0;
}
.banner-wrap .swiper-slide.swiper-slide-active .swiper-bg1{
  /*animation-name: swiper-bg;*/
}
.banner-wrap .swiper-txt-box {
  position: absolute;
  top:50%;
  left:50%;
  width: 328px;
  height:328px;
  border-radius: 20px;
  background-color: #fff;
  box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.2);
  transform: translate(-50%,-50%);
  text-align: center;
  z-index: 1;
}
.banner-wrap .swiper-txt-box .box-tit{
  display: block;
  margin:0 46px 24px;
  padding: 81px 0 28px;
  border-bottom:1px solid rgba(0, 0, 0, 0.1);
}
.banner-wrap .swiper-txt-box .box-tit .tit-creativetoon,
.banner-wrap .swiper-txt-box .box-tit .tit-imeresu,
.banner-wrap .swiper-txt-box .box-tit .tit-goodsdream{
  display: inline-block;
  width: 100%;
  height: 34px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: auto 34px;
}
.banner-wrap .swiper-txt-box .box-tit .tit-creativetoon{
  background-image: url(images/img-title-5.svg);
}
.banner-wrap .swiper-txt-box .box-tit .tit-imeresu{
  background-image: url(images/img-title-6.svg);
}
.banner-wrap .swiper-txt-box .box-tit .tit-goodsdream{
  background-image: url(images/img-title-7.svg);
}
.banner-wrap .swiper-txt-box .box-txt{
  display: block;
  line-height: 24px;
  font-size:16px;
  color:#111;
  letter-spacing: -0.8px;
}
.banner-wrap .swiper-txt-box .swiper-box-link{
  position: absolute;
  left: 50%;
  bottom:41px;
  display: inline-block;
  transform: translateX(-50%);
  min-width: 112px;
  line-height: 40px;
  margin:0 auto;
  border-radius: 20px;
  background-color: #ff9000;
  color:#fff;
  font-size: 15px;
  
}
@keyframes swiper-bg {
  0%   {background-position: 0 center;}
  100% {background-position: 1920px center;}
}
.banner-wrap .swiper-container-horizontal > .swiper-pagination-bullets, 
.banner-wrap .swiper-pagination-custom, 
.banner-wrap .swiper-pagination-fraction{
  bottom: 50px;
}

.banner-wrap .swiper-pagination-bullet{
  background-color: #ffa400;
  opacity: 0.3;
  transition: 0.5 ease;
}
.banner-wrap .swiper-pagination-bullet-active{
  width: 40px;
  border-radius: 4px;
  background-color: #ffa400;
  opacity: 1;
}
@media screen and (max-width: 1400px) {
  .toon-info .toon-info-right-bottom{
    top:330px;
    right: -180px;
  }
}      
@media screen and (max-width: 1280px) {
  .toon-info .toon-info-header-tit{
    width: 312px;
    height:167px;
    background-size: 312px auto;
  }
  .toon-info .toon-info-cloud-right{
    top:50px;
    right: -270px;
  }
  .toon-info .toon-info-cloud-left{
    top:100px;
    left: -185px;
  }
  .toon-info .toon-info-right-bottom{
    top:330px;
    right: -500px;
  }
  .toon-info .toon-info-gift{
    margin-left:-100px;
  }
  .toon-info .toon-info-gift .toon-info-gift-character{
    width:424px;
    height:421px;
    background-size: 424px auto;
  }
  .toon-info .toon-info-gift2{
    width:159px;
    height:210px;
    background-size: 159px auto;
    margin-left: 210px;
  }
  .toon-info .toon-info-gift2:after{
    top: -80px;
    left: -80px;
    width: 324px;
    height: 325px;
    background-size: 280px auto;
  }
  .toon-info .toon-info-gift3{
    width:180px;
    height:184px;
    background-size: 180px auto;
    margin-left: 100px;
  }
  .toon-info-container {
    width: 1184px;
    min-height: 900px;
  }
  .toon-info .toon-info-frame-wrap{
  }
  .toon-info .toon-info-frame{
    left:50%;
    margin-left: 33px;
    transform: translateX(-50%);
  }
  .toon-info .toon-info-frame:after{
  }
  .toon-info .toon-info-frame:before{
  }
  .toon-info .toon-info-frame-bg{
    left: 50%;
    margin-left: -317px;
  }
  .toon-info .toon-info-gift-character2{
    left: 50%;
    width:359px;
    height:516px;
    background-size: 280px auto;
    margin-left: 150px;
  }
  .video{
    padding:10% 0;
    min-height: 490px;
    /*background-color: rgba(0, 0, 0, 0.9);*/
  }
  .video-wrap{
    /*background-color: rgba(0, 0, 0, 1);*/
  }
  .video-wrap video{
    max-width: 100%;
  }
  .video-wrap .btn-wrap .btn-play,
  .video-wrap .btn-wrap .btn-pause{
    width: 72px;
    height:72px;
    background-size: 72px auto;
  }
    

}
@media screen and (max-width: 720px) {
  .toon-info .gnb-bi-img{
    margin-left: -25%;
  }
  .toon-info .gnb-bi-img img{
    width: 120px;
  }
  .toon-info-header{
    min-height: 800px;
    background-size: 1500px auto;
    background-position: top center;
  }
  .toon-info .toon-info-header-tit{
    width: 232px;
    height:124px;
    background-size: 232px auto;
  }
  .toon-info .toon-info-header-tit:after{
  top: 255px;
  left: 190px;
  width: 100px;
  height: 90px;
  background-size: 100px auto;
}
  .toon-info .toon-info-cloud-right{
    top:50px;
    right: -120px;
    width: 200px;
  }
  .toon-info .toon-info-cloud-left{
    top:100px;
    left: -285px;
  }
  .toon-info .toon-info-right-bottom{
    top:420px;
    right: -300px;
    width: 500px;
    width: 400px;
  }
  .toon-info .toon-info-gift{
    top:250px;
    margin-left:-50px;
  }
  .toon-info .toon-info-gift:after{
    top:-90px;
    left: 0;
    width: 300px;
    height: 150px;
    background-size: 300px auto;
  }
  .toon-info .toon-info-gift:before{
    left: 90px;
    width: 100px;
    height: 50px;
    background-size: 100px auto;
  }
  .toon-info .toon-info-gift .toon-info-gift-character{
    width:265px;
    height:264px;
    background-size: 265px auto;
  }
  .toon-info .toon-info-gift2{
    width:113px;
    height:132px;
    margin-top:150px;
    background-size: 113px auto;
    margin-left: 0px;
  }
  .toon-info .toon-info-gift2:after{
    top: -80px;
    left: -80px;
    width: 324px;
    height: 325px;
    background-size: 280px auto;
  }
  .toon-info .toon-info-gift3{
    width:154px;
    height:164px;
    margin-top:-220px;
    background-size: 154px auto;
    /*margin-left: -200px;*/
    margin-left: -31%;
  }
  .toon-info-container {
    width: 1184px;
    min-height: 500px;
  }
  .toon-info .toon-info-frame-wrap{
  }
  .toon-info .toon-info-frame{
    left:55%;
    width: 800px;
    height:427px;
    margin-top:10px;
    margin-left:-36%;
    transform: translateX(-50%);
    background-size: 969px auto;
  }
  .toon-info .toon-info-frame:after{
    top:-20px;
    width:62px;
    height: 53px;
    margin-left: 37px;
    transform: translateX(-50%);
    background-size: 62px auto;
  }
  .toon-info .toon-info-frame:before{
    top:initial;
    top:inherit;
    bottom:-60px;
    left: 50%;
    width: 174px;
    height: 80px;
    margin-left: 47px;
    background-size: 174px auto;
    transform: translateX(-50%);
  }
  .toon-info .toon-info-frame-bg{
    left: 50%;
    height: 300px;
    margin-top:-60px;
    margin-left: -530px;
    background-size: 432px auto;
  }
  .toon-info .toon-info-gift-character2{
    left: 50%;
    width:204px;
    height:309px;
    background-size: 204px auto;
    transform: translate(-50%,-50%);
    margin-top:120px;
    /*margin-left: -280px;*/
    margin-left: -20%;
  }
  .video{
    min-height: 200px;
    /*background-color: rgba(0, 0, 0, 0.9);*/
  }
  .video-wrap{
    padding:60% 0 10%;
  }
  .video-wrap,
  .video .video-wrap{
    max-width: 100%;
  }

  .video-wrap video{
    /*position: absolute;
    top:50%;*/
    max-width: 100%;
  }
  .video-wrap .video-txt{
    top:40px;
    width: 200px;
    height:190px;
    margin-left: -50px;
    background-size: 200px auto;
  }
  .video-wrap .btn-wrap{
    width: 50px;
    height:50px;
  }
  
  .video-wrap .btn-wrap .btn-play,
  .video-wrap .btn-wrap .btn-pause{
    width: 50px;
    height:50px;
    background-size: 50px auto;
  }
  .video-wrap .btn-wrap .btn-play.active,
  .video-wrap .btn-wrap .btn-pause.active{
    /*display: block;*/
    opacity: 0.9;
  }
  .banner-wrap{
    height: 700px;
  }
  .banner-wrap .banner-tit{
    top:105px;
    height: 34px;
    background-size: auto 34px;
  }
  .banner-wrap .swiper-txt-box{
    width:240px;
    height:240px;
    transform: translate(-50%,-50%);
  }
  .banner-wrap .swiper-txt-box .box-tit{
    margin-bottom:16px;
    padding:47px 0 16px;
  }
  .banner-wrap .swiper-txt-box .box-tit .tit-creativetoon, 
  .banner-wrap .swiper-txt-box .box-tit .tit-imeresu, 
  .banner-wrap .swiper-txt-box .box-tit .tit-goodsdream{
    background-size: auto 25px;
  }
  .banner-wrap .swiper-container-horizontal > .swiper-pagination-bullets, 
  .banner-wrap .swiper-pagination-custom, .banner-wrap .swiper-pagination-fraction{
    bottom:5%;
  }
  .banner-wrap .swiper-txt-box .box-txt{
    overflow: hidden;
    padding:0 20px;
    font-size: 13px;
    line-height: 18px;
  }
  .banner-wrap .swiper-txt-box .swiper-box-link{
    bottom:33px;
  }
  .banner-wrap .swiper-txt-box .box-txt br{
    /*display: none;*/
  }
  
  .toon-info .btn-wrap .btn-scroll, 
  .toon-info .btn-wrap .btn-top{
    width: 48px;
    height:48px;
  }
  .toon-info .btn-wrap .btn-scroll{
    background-image: url(images/btn-scroll-m.svg);
  }
  .toon-info .btn-wrap .btn-top{
    background-image: url(images/btn-top-m.svg);
  }
  
}

@media screen and (max-width: 414px) {
  .toon-info .toon-info-gift-character2{
    margin-left: -25%;
  }
  .toon-info .toon-info-frame{
    width: 969px;
    margin-left: -37.5%;
    background-size: 969px auto;
  }
  .toon-info .toon-info-frame:after{
    left: 43%;
    transform: translateX(0%);
  }
  .toon-info .toon-info-frame-bg{
    left: 50%;
    height: 300px;
    margin-top:-60px;
    margin-left: -600px;
    background-size: 432px auto;
  }
}