body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td { margin: 0; padding: 0; }
* { -webkit-box-sizing: border-box; box-sizing: border-box; }
table { border-collapse: collapse; border-spacing: 0; }
fieldset, img { border: 0; }
address, caption, cite, code, dfn, em, strong, th, var { font-style: normal; font-weight: normal; }
ol, ul { list-style: none; }
caption, th { text-align: left; }
h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal; }
q:before, q:after { content: ""; }
abbr, acronym { border: 0; }
ul { list-style: none; }
a {  text-decoration: none; }
a:focus {  outline: none; }
a:link {  color: #0066aa; text-decoration: none;}
a:visited { color: #0066aa;  text-decoration: none; }
a:hover { color: #0066aa; text-decoration:underline;}
a:active { color: #0066aa; text-decoration: none; }
input,button,textarea,select { font-size: 100%; margin: 0; padding: 0; background: none; border: none; border-radius: 0; outline: none; -webkit-appearance: none; appearance: none; }
hr { display: block; border: none; padding: 0; margin: 0; }
svg { width: 100%; }
img {vertical-align: middle;}
.slick-slide {outline: none!important;}

.fadeIn { transform: translate(0, 100px); opacity: 0; transition: 1s; transition-delay: .2s; }
.fadeIn.on { transform: translate(0, 0); opacity:1; }

@keyframes circleScale {
  0% {
    opacity:0;
    transform: scale(1)
  }
  5% {
    opacity:.6;
  }
  80% {
    opacity:.6;
  }
  100% {
    opacity:0;
    transform: scale(3)
  }
}

@keyframes sizeScale {
  0% {
    transform: translate(150px, -150px) skewX(-45deg);
    opacity:0;
  }
  15% {
    transform: translate(50px, -50px) skewX(-45deg);
    opacity:.8;
  }
  85% {
    transform: translate(50px, -50px) skewX(-45deg);
    opacity:.8;
  }
  100% {
    transform: translate(-50px, 50px) skewX(-45deg);
    opacity:0;
  }
}

#contentsWrapper .contArea { padding-top: 0!important; }
.mdlContent { display: none; }
.mdlContent a { margin-top: 20px; }
.mdlContent img.logo { margin-bottom: 20px; }
.mdlContent p { text-align: left; line-height: 1.8; }
.mdlContent p.mdlHead1 { text-align: center; font-size: 21px; font-weight: bold; margin-bottom: 20px; }
.mdlContent p.mdlHead2 { text-align: center; font-size: 26px; margin-bottom: 20px; color:#eb5505; font-weight: bold;}
#modalBox { text-align: center; margin: 0 auto; overflow: auto; background: #fff; border: 4px solid #333; max-width: 840px; margin: 0 auto; padding: 30px 30px; display: none; }
#bgmdl { visibility: hidden; position: fixed; top: 0; left: 0; width: 100%; height: 100%; height: 100vh; background-color: rgba(30,30,30,.8); z-index: 999; }
#bgmdl.on { visibility: visible; }
#clsmdl { display: block; text-align: center; padding-top: 30px; }

.ancArrw { display: inline-block; transform: scale(1,.6) rotate(90deg); }
#chargeContentWrap { font-family:'Noto Sans','Noto Sans JP','Noto Sans CJK JP','Noto Sans CJK JP Subset',sans-serif!important; font-weight: 400; }

@media screen and (min-width: 768px) {
  #chargeContentWrap { max-width: 1620px; margin: 0 auto; color:#fff; overflow: hidden; font-family:'Noto Sans','Noto Sans JP','Noto Sans CJK JP','Noto Sans CJK JP Subset',sans-serif; font-weight: 400; }
  #mv { background: url(https://www.au.com/content/dam/au-com/mobile/charge/pr/img/bg-mv.jpg) no-repeat center center; height: 600px; text-align: center; }
  #mv p { color: #fff; font-size: 14px; text-align: center; margin-bottom: 20px; }
  #mv p a { color: #fff!important; }
  #block1 { background: #01162d url(https://www.au.com/content/dam/au-com/mobile/charge/pr/img/bg-block1.png) no-repeat center top; padding-top: 90px; }
  #block2 { /*background: url(/content/dam/au-com/mobile/charge/pr/img/bg-block2.png) center top; */padding-top: 100px; }
  #block3 { /*background-repeat: no-repeat;
    background-position: center top; 
    background-image: url(/content/dam/au-com/mobile/charge/pr/img/bg-block3.jpg),linear-gradient(180deg, #000407 400px, #01172e 70%);*/
    padding-top: 100px; padding-bottom: 140px;
  }

  #bg_bl {
    background-repeat: repeat;
    background-position: center top; 
    background-image: url(https://www.au.com/content/dam/au-com/mobile/charge/pr/img/bg-bl.png),linear-gradient(180deg, #072046 0, #baafa1 50%, #ff7d50 100%);
  }

  #block4 { background:#000 url(https://www.au.com/content/dam/au-com/mobile/charge/pr/img/bg-bl4.jpg) no-repeat; background-size: cover;  padding-top: 100px; padding-bottom: 150px; margin: 0 auto; }

  h1 { text-align: center; max-width: 785px; width: 90%;  margin: 0 auto;font-weight: 700;padding-top: 107px;  }
  h1 span { display: block;  height: 100px; line-height: 100px; /*font-size: 56px;*/position: relative; z-index: 1; }
  h1 span span { color:#fff; background: #000; white-space: nowrap; overflow: hidden; width: 0; transition: .6s; transition-property: width, transform; padding: 0 /*3%*/; opacity: 0;  transform: translate(8px,8px); }
  h1 > span::after { content:''; display: block; height: 100px; line-height: 100px; background: linear-gradient(90deg, #072046 0, #baafa1 50%, #ff7d50 100%);; width: 100%; position: absolute; top: 0; left: 0; transform: translate(0,0); opacity: 0; z-index: 0; transition: 1s; }
  h1 > span:nth-child(1) { width: 98%; margin-left: 1%; margin-bottom: 35px; }
  h1 > span:nth-child(2) { width: 94.2%; margin-left: 2.9%; margin-bottom: 35px; }
  h1 > span:nth-child(3) { width: 76.4%; margin-left: 11.8%; margin-bottom: 53px; }
  h1 > span:nth-child(1) span img { width: 770px; width: 86vw; max-width: 770px; }
  h1 > span:nth-child(2) span img { width: 730px; width: 80vw; max-width: 730px; }
  h1 > span:nth-child(3) span img { width: 600px; width: 67vw; max-width: 600px; }
  h1 > span.on span { width: 100%; opacity: 1; }
  h1 span:nth-child(3) span { color:#eb5505; }
  h1 > span.on.shadow span { transform: translate(0,0);transition: 1s; }
  h1 > span.on.shadow::after { transform: translate(16px,16px); opacity: 1; }


  h1 img { /*max-width: 785px;*/ width: 100%; }
  h2 { text-align: center;}
  #block1 h2 img { width: 100%; max-width: 493px; }
  #block2 h2 { margin-bottom: 60px; }
  #block2 h2 img { width: 100%; max-width: 697px; }
  #block3 h2 img { width: 100%; max-width: 838px; }

  .h2-lead { font-size: 17px; text-align: center; margin-bottom: 100px; line-height: 1.6; margin-top: 20px; color:#fff }
  .h2-lead a { color:#fff!important; }

  #block1serifWrap { padding: 40px 0; position: relative; background-image: linear-gradient(140deg, #005f80 40%, #003366 70%); }
  #block1serifWrap::before { content:''; width: 0; height: 0; border-style: solid; border-width: 0 20px 20px 20px; border-color: transparent transparent #005f80 transparent; position: absolute; top: -20px; left: calc(50% - 20px); }
  #block1serifWrap p { text-align: center; }
  #block1serif { font-size: 24px; overflow: hidden; text-align: center; }
  #block1serif h4 { font-weight: bold; }
  #block1serif ul { display: flex; justify-content: space-between; max-width: 980px; margin: 20px auto; }
  #block1serif ul li { width: 32%; text-align: center; line-height: 2; font-size: 20px; height: 120px; line-height: 120px; border: 2px solid #eb5505;  }

  .logo-2col { display: flex; justify-content:space-between; max-width: 780px; margin: 0 auto 30px; align-items: center; }
  .logo-2col > p { width: 48%; }
  .ln-gry { height: 120px; border: 4px solid #eee; /*display: flex; flex-wrap: wrap; align-items: center;*/ margin: 0!important;  }
  div.ln-gry {  max-width: 780px; margin: 0 auto 5%!important; text-align: center;}
  .ln-gry.independ { width: 48%;  margin: 0 auto 5%!important;  }
  .ln-gry span { display: block; width: 100%; }
  .ln-gry img { margin: 24px auto 0; width: 50%!important; }
  .ln-gry img.amz2 { width: 26%!important; }
  .ln-gry img.echo { width: 70%!important; margin-top: 14px; }
  .ln-gry a { display: block; width: 100%; text-align: center; font-weight: normal; font-size: 12px; color:#222!important; transition: .6s; }
  .ln-gry a:hover { opacity: .6;}
  .ln-gry a img { display: inline-block; width: 18px!important; margin: 0; }
  div.ln-gry a img { display: inline-block; width: 18px!important; margin: 0; }

  #slide2anchor { max-width: 980px; text-align: center; margin: 0 auto 40px; }
  #slide2anchor ul { display:flex; justify-content: space-between; }
  #slide2anchor ul li { width: 31%; }
  #slide2anchor ul li a { display: block; height: 40px; line-height: 40px; font-size: 21px; color:#777; border-bottom: 2px solid #777; }
  #slide2anchor ul li a:hover,
  #slide2anchor ul li a.on { color:#eb5505; border-bottom: 2px solid #eb5505; text-decoration: none; }

  #chargeWrap { margin: 10% auto 3%; text-align: center; max-width: 980px; }
  .chargeBox { margin: 0 auto; background-color: rgba(0,0,0,.7); background-image: url(https://www.au.com/content/dam/au-com/mobile/charge/pr/img/bg-content-head.png),url(https://www.au.com/content/dam/au-com/mobile/charge/pr/img/bg-content-bottom.png); background-repeat: no-repeat, no-repeat ; background-position: center top, center bottom; background-size: 100% auto, 100% auto;
    padding: 56px 20px 80px; position: relative;}
  .chargeBox .ribon img { position: absolute; top: 0; left: 0; width: 156px; }
  .chargeBox img { width: 100%; max-width: 780px; }
  .chargeBox h3 { width: 562px; margin: 0 auto 50px;}

  .chargeBoxAccordionBox { background: #e6eaee; position: relative; max-width: 780px; margin: 0 auto; }
  .chargeBoxAccordionBox a { width: 52px; display: block; position: absolute; top: 40px; right: 40px; }
  .chargeBoxAccordionBox a img { width: 100%; }
  .chargeBoxAccordionBox a.open img { transform: rotate(180deg);}
  .chargeBoxAccordionBox .accContent { display: none;}
  .chargeBoxAccordionBox .accContent.open { display: block;}
  
  a.chargeDetail { height: 60px; line-height: 60px; display: block; background: #f3f3f3; color:#111!important; font-size: 16px; position: relative; margin-top: 40px; transition: .6s }
  a.chargeDetail:hover { opacity: .6; }
  a.chargeDetail::after { content: '\FF1E'; position: absolute; top: 0; right: 30px; line-height: 60px; font-size: 24px; font-weight: bold; transform: scale(0.7, 1); }

  .tetherLnk { border: 5px solid #eb5505; background: #fff url(https://www.au.com/content/dam/au-com/mobile/charge/pr/img/bg-question.png) left -20px center no-repeat; margin: 0 auto; color:#eb5505!important; display: block;font-size: 20px; font-weight: bold; padding: 20px 0; position: relative; max-width: 780px; display: block; transition: .6s; }
  .tetherLnk:hover { opacity: .6; }
  .tetherLnk::before { content:''; display: block; width: 0; height: 0; border-style: solid; border-width: 0 0 84px 84px; border-color: transparent transparent #eb5505 transparent; position: absolute; bottom: 0; right: 0; }
  .tetherLnk img { width: 90px!important; margin-bottom: 14px; }
  .tetherLnk img.quest { width: 38px!important; position: absolute; margin-bottom: 0; bottom: 3px; right: 3px; }
  .tetherLnk span { font-size: 16px; font-weight: normal; }

  .pls {width: 84px; margin-top: -20px; margin-bottom: -15px; position: relative; z-index: 1; }
 
#netflixArea { text-align: center; }
#netflixArea h2 { margin-bottom: 60px; }
#netflixArea h3 { height: 100px; display: inline-block; padding: 0 40px; font-size: 34px; line-height: 100px; border-top: 2px solid #fff; border-bottom: 2px solid #fff; }
#netflixArea p { font-size: 32px; color: #eb5505; }
#netflixArea p span.note { color: #fff!important; font-size: 12px; text-align: left; line-height: 1.6; display: inherit; padding: 0; max-width: 765px; margin: 0 auto 30px; }
#netflixArea p img { margin-bottom: 30px; }
#netflixArea p span.tx { display: block; margin-bottom: 40px;}
#netflixAreadetail { padding: 65px 0; max-width: 980px; margin: 0 auto; background-color: rgba(0,0,0,.7); }
#netflixAreadetail img { max-width: 765px; }
#netflixAreadetail ul.note { margin-bottom: 20px;}
#netflixAreadetail ul.note li { text-align: center; }
#netflixArea a { text-align: center; color: #fff; margin-top: 50px;}
#netflixArea a.btn { margin-top: 50px; border: 2px solid #fff;}
#netflixArea a img { width: 27px;}


#block4 h3 { text-align: center; font-size: 30px; font-weight: bold; margin-bottom: 50px; }
#block4 ul { display: flex; margin: 0 auto; max-width: 960px; justify-content: space-between; flex-wrap: wrap; }
#block4 ul li:not(:nth-child(3)) { width: 49%; text-align: center; border: solid #eb5505 3px; position: relative; background: #fff; }
#block4 ul li a { display: block; padding: 20px 0; text-decoration: none!important; transition: .5s; }
#block4 ul li a:hover { opacity: .6;}
#block4 ul li a img { width: 17%; }
#block4 ul li:not(:nth-child(3)) p { font-size: 18px; color:#333; margin-bottom: 20px; }
#block4 ul li p span { font-size: 22px; color: #eb5505; font-weight: bold; }
#block4 ul li:not(:nth-child(3))::before { content:''; display: block; width: 0; height: 0; border-style: solid; border-width: 0 0 50px 50px; border-color: transparent transparent #eb5505 transparent; position: absolute; bottom: 0; right: 0; }
#block4 ul li:not(:nth-child(3))::after { content:'\FF1E'; display: block; position: absolute; bottom: 0; right: 0; color:#fff; font-weight: bold; transform: scale(0.7, 1); font-size: 20px; }

#block4 ul li:nth-child(3) { width: 49%; text-align: center; }
#block4 ul li:nth-child(3) p{font-size: 14px; margin: 10px auto 0;}


  .slider1,.slider2,.slider3 { max-width: 980px; margin: 0 auto 10px; }
  .slick-slide {  }
  .slick-slide img { width: 100%; }
  .slick-list { margin-bottom: 20px!important; }
  
  .slider1 .slick-list { overflow: visible;}
  .slider1 .slick-slide { transition: .5s; opacity: .5; }
  .slider1 .slick-slide.slick-active,
  .slider1 .slick-slide.slick-cloned.on { opacity: 1; transform: translateY(-30px); }
  .slider1 .slick-slide h3 { text-align: center; color:#eb5505; font-size: 24px; margin-bottom: 20px; font-weight: bold; line-height: 1; }
  .slider1 p { padding: 0 20px; font-size: 16px; text-align: center; }
  .slider1 p.note { padding: 15px 0 0; font-size: 12px; text-align: center; }
  .sld1fx { display: flex; align-items: center; width: 92%; margin: 0 auto; background:rgba(1,22,45,.6); }
  .sld1fxL { width: 55.5%; }
  .sld1fxR { width: 44.4%; }
  
  
  .slider2 .slick-slide { text-align: center; background-color: rgba(0,0,0,.3); background-image: url(https://www.au.com/content/dam/au-com/mobile/charge/pr/img/bg-content-head.png),url(https://www.au.com/content/dam/au-com/mobile/charge/pr/img/bg-content-bottom.png); background-repeat: no-repeat, no-repeat ; background-position: center top, center bottom; background-size: 100% auto, 100% auto; padding-bottom: 40px; }
  .slider2 .slick-slide p { max-width: 600px; line-height: 1.6; text-align: center; }
  .slider2 .slick-slide p.attention { max-width:none; line-height: 1.6; text-align: center; font-size: 14px; padding-bottom: 20px; }
  .slider2 h3 { padding: 15px 30px; border-radius: 6px; display: inline-block; margin: 45px auto 30px; text-align: center; font-size: 22px; font-weight: bold; line-height: 1.2; border-bottom: none;background: linear-gradient(90deg, #f48221 20%, #ec5a07 80%) ; color: #fff; }
  .sld2flx { display: flex; justify-content: space-between; align-items: center; max-width: 780px; margin: 0 auto; padding-bottom: 20px; }
  .sld2flx.s1 { padding-bottom: 20px; }
  .sld2flx > div { width: 49%;}
  .sld2flx > div p { font-size: 26px; margin-bottom: 20px; color: #fff; }
  .sld2flx > div p.note { font-size: 12px; text-align: left; margin-bottom: 0; padding: 20px 10px 0; color:#fff;}
  .sld2flx > div img { width: 100%; max-width: 380px;}
  .sld2mono { max-width: 780px; margin: 0 auto 50px; padding-bottom: 30px; padding-top: 30px; background: #e6eaee; }
  .sld2mono .sld2monoInner {max-width: 670px; margin: 0 auto;}  
  .sld2mono div.flx { display: flex; justify-content: space-between; margin: 20px auto; }
  .sld2mono div.flx > div { width: 49%; font-size: 16px; }
  .sld2mono div.flx h4 { color: #eb5505; border: 2px solid #eb5505; height: 30px; line-height: 26px; font-weight: bold; margin-bottom: 14px; }
  .sld2mono div.flx p {  }
  .sld2mono .sld2monoInner p { font-size: 17px; margin: 0 auto 10px; color: #111; }
  a.btnOrangeSld2 { display: block; width: 460px; height: 40px; line-height: 40px; border-radius: 20px; color: #fff; font-size: 16px; background: linear-gradient(90deg, #f48221 30%, #ec5a07 70%) ; margin: 0 auto; color:#fff!important; position: relative; }
  a.btnOrangeSld2::after { content: '\FF1E'; position: absolute; right: 20px; transform: scale(.6,1); }
  .sld2mono ul.note li { color: #111; font-size: 11px; margin-bottom: 1px; line-height: 1.2; }
  
  .slick-dots { position: relative; display: block; width: 100%; padding: 0; margin: 0 auto 7%; list-style: none; text-align: center; line-height: 1!important; }
  .slick-dots li button { font-size: 0; line-height: 0; display: block; width: 10px; height: 10px; /*padding: 5px;*/ cursor: pointer; border: 0; outline: none; background: #777; border-radius: 10px; }
  .slick-dots li.slick-active button { background: #ea5404; }
  /*.slick-dots li button { background: #333; }*/
  /*.slick-dots li.slick-active button { background: #fff; }*/
  .slick-dots li button:before { content:''; }

  .slick-prev, .slick-next { font-size: 0; line-height: 0; position: absolute; bottom: calc(50% + 18px); display: block; padding: 0; cursor: pointer; color: transparent; border: none; outline: none; height: 72px; width: 72px; line-height: 72px; text-align: center; background: linear-gradient(90deg, #f48221 30%, #ec5a07 70%); }
  
  .slick-prev:hover,
  .slick-next:hover { opacity: .5; }
  .slick-prev { left: 0%; z-index: 1; text-decoration: none!important; }
  .slick-next { right: 0%; z-index: 1; text-decoration: none!important; }
  .slick-prev:before { content: '\FF1C'; display: block; line-height: 72px; height: 72px; transform: scale(0.7, 1); font-weight: bold; color:#fff!important; }
  .slick-next:before { content: '\FF1E'; display: block; line-height: 72px; height: 72px; transform: scale(0.7, 1); font-weight: bold; color:#fff!important; }
  
  .slick-prev:before, 
  .slick-next:before { font-size: 20px; 
    -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

  .slider2 .slick-prev, 
  .slider2 .slick-next { bottom: 50%; }

  ul.note { margin: 0 auto; }
  ul.note li { font-size: 14px; line-height: 1.8; margin-bottom: 3px; text-align: left; }
  ul.note li.taCpc { text-align: center; margin-bottom: 5px;}

  .noteLnk { text-align: right; font-size: 16px; margin: 0 5% 5%; }
  .noteLnk a { color: #fff!important; }
    
  .chargeBox ul.note { margin: 20px auto; max-width: 780px; }
  .chargeBox .noteLnk { margin: 0 auto 30px; max-width: 780px; }

  #btmNoteList { max-width: 980px; margin: 60px auto; }
  #btmNoteList ul { text-align: left; font-size: 12px; }
  #btmNoteList ul li { line-height: 1.6; padding-left: 1em; text-indent: -1em; color: #333; margin-bottom: 2px; }

  a.btn { max-width: 600px; display: block; margin: 0 auto; height: 90px; line-height: 90px; border-radius: 45px; font-weight: bold; color:#fff!important; text-align: center; font-size: 24px; background: linear-gradient(90deg, #f48221 30%, #ec5a07 70%) ; position: relative; border: 2px solid #fff; box-shadow: 0 0 10px 10px rgba(0,0,0,.3); }
  a.btn::before { content: '\FF1E'; line-height: 90px; position: absolute; top: 0; right: 40px; display: block; transform: scale(0.7, 1); font-weight: bold; }
 

  #modalBox a { transition: .6s;}
  #modalBox a:hover { opacity: .6; }

  #mdl12.mdlContent a.logoBox { border:#e6eaee 1px solid ; padding: 20px; text-align: left; font-size: 18px; width: 94%;}
  #mdl12.mdlContent a.logoBox img { width: 50%; margin-bottom: 0; }
  #mdl12.mdlContent a.logoBox span { display: inline-block;  color: #111!important; }

  #fltCV { position: fixed; bottom: 0; left: 0; width: 100%; background: #fdeee6; padding: 20px; z-index: 5;}
  #fltCV ul { display: flex; justify-content: center; }
  #fltCV ul li { width: 50%; padding: 0 1%; max-width: 320px; }
  #fltCV ul li a { display: block; text-align: center; border-radius: 30px; height: 60px; line-height: 60px; background: #eb5505; color:#fff; transition: .5s; text-decoration: none; position: relative; }
  #fltCV ul li a::after { position: absolute; top: 0; right: 20px; content: '＞'; transform: scale(.6, 1); }
  #fltCV ul li:last-child a::after { content:''; display: block; height: 100%; width:22px; background:url(https://www.au.com/content/dam/au-com/mobile/charge/pr/img/icon-link-outer-w.png) no-repeat center center; background-size: 11px; transform: scale(1, 1); }
  #fltCV ul li a:hover { opacity:.6; }

  a img.icon-outer { width: 12px!important; display: inline!important; }
  .footerElem{ padding-bottom: 100px!important; background: #f3f3f3;}
}

@media screen and (min-width: 1199.98px) {#fltCV { padding-left: 180px;} }
@media screen and (max-width: 1199px) and (min-width: 768px) { }
@media screen and (min-width: 1620px) { #mainBox { background-size: 100%; }}
@media screen and (max-width: 980px) and (min-width: 768px) { h1 span { font-size: 49px;} }

@media screen and (max-width: 767.98px) and (min-width: 0px) {
  
  #chargeContentWrap { color:#fff; }
  #block1 { background: #01162d url(https://www.au.com/content/dam/au-com/mobile/charge/pr/img/bg-block1-sp.png) no-repeat center top; padding-top: 10%; background-size: contain; }
  #block2 { /*background: url(/content/dam/au-com/mobile/charge/pr/img/bg-block2.png) center top; */padding-top: 15%; }
  #block3 { background-repeat: no-repeat;
    /*background-position: center top; 
    background-image: url(/content/dam/au-com/mobile/charge/pr/img/bg-block3.jpg),linear-gradient(180deg, #000407 40vw, #01172e 70%);*/
    padding-top: 10%; padding-bottom: 10%;
    background-size: 360%;
  }
  #block4 { background: #000 url(https://www.au.com/content/dam/au-com/mobile/charge/pr/img/bg-bl4.jpg) center center no-repeat; background-size: 300%; padding-bottom: 15%; padding-top: 10%; }

  #bg_bl {
    background-repeat: repeat;
    background-position: center top; 
    background-image: url(https://www.au.com/content/dam/au-com/mobile/charge/pr/img/bg-bl.png),linear-gradient(180deg, #072046 0, #baafa1 50%, #ff7d50 100%);
    background-size: 30%, 100%;
  }
  #mv { background-image: url(https://www.au.com/content/dam/au-com/mobile/charge/pr/img/h1-sp.jpg); background-size: 100%; height: 127vw; }
  #mv p { color: #fff; font-size: 2.8vw; text-align: center; margin-bottom: 20px; }
  #mv p a { color: #fff!important; }
  h1 { text-align: center; width: 100%; background-image: url(https://www.au.com/content/dam/au-com/mobile/charge/pr/img/h1-sp.jpg);
    background-size: 100%; font-weight: 700; padding-top: 38vw;  }
  h1 span { display: block;  height: 14vw; line-height: 14vw; /*font-size: 6.2vw;*/ position: relative; z-index: 1; }
  h1 span span { color:#fff; background: #000; white-space: nowrap; overflow: hidden; width: 0; transition: .5s; transition-property: width, transform; padding: 0; opacity: 0;  transform: translate(1vw,1vw); display: block; }
  h1 > span::after { content:''; display: block; height: 14vw; line-height: 14vw; background: linear-gradient(90deg, #072046 0, #baafa1 50%, #ff7d50 100%); width: 100%; position: absolute; top: 0; left: 0; transform: translate(0,0); opacity: 0; z-index: 0; transition: 1s; }
  h1 > span:nth-child(1) { width: 91%; margin-left: 4.5%; margin-bottom: 5%; }
  h1 > span:nth-child(2) { width: 88%; margin-left: 6%; margin-bottom: 5%; }
  h1 > span:nth-child(3) { width: 70%; margin-left: 15%; margin-bottom: 20%; }

  h1 > span:nth-child(1).on span img { width: 87.6vw; }
  h1 > span:nth-child(2).on span img { width: 84.6vw; }
  h1 > span:nth-child(3).on span img { width: 67vw; }


  h1 > span.on span { width: 100%; opacity: 1; }
  h1 span:nth-child(3) span { color:#eb5505; }
  h1 > span.on.shadow span { transform: translate(0,0);transition: 1s; }
  h1 > span.on.shadow::after { transform: translate(2vw,2vw); opacity: 1; }

  h1 img { width: 100%; }
  h2 { text-align: center; }
  #block1 h2 img { width: 50%; }
  #block2 h2 { margin-bottom: 7%; }
  #block2 h2 img { width: 70%; }
  #block3 h2 img { width: 90%; }

  .h2-lead { font-size: 3.5vw; text-align: center; margin-bottom: 8%; margin-top: 4%; color:#fff }
  .h2-lead a { color:#fff!important; }

  #block1serifWrap { padding: 9% 0; position: relative; background-image: linear-gradient(140deg, #005f80 40%, #003366 70%); }
  #block1serifWrap::before { content:''; width: 0; height: 0; border-style: solid; border-width: 0 4vw 4vw 4vw; border-color: transparent transparent #005f80 transparent; position: absolute; top: -4vw; left: calc(50% - 4vw); }
  #block1serifWrap p { text-align: center; width: 80%; margin: 0 auto; }
  #block1serifWrap p img { width: 100%; }
  #block1serif { font-size: 4vw; overflow: hidden; text-align: center; }
  #block1serif ul { margin: 4% auto; }
  #block1serif ul li { width: 80%; text-align: center; line-height: 2; font-size: 4vw; height: 14vw; line-height: 14vw; border: 1px solid #eb5505; margin: 0 auto 4%; }

  .logo-2col { display: flex; justify-content:space-between; margin: 0 5% 5%; align-items: center; }
  .logo-2col > p { width: 48%;  }
  .ln-gry { height: 25vw; border: 1vw solid #eee; /*display: flex; flex-wrap: wrap; align-items: center;*/ margin: 0!important; padding-top: 8%; }
  div.ln-gry { margin: 0 5% 5%!important; padding-top: 2%; } 
  .ln-gry.independ { width: 48%;  margin: 0 auto 5%!important;  }
  .ln-gry img { margin: 0 auto; width: 80%!important; margin-bottom: 2%; }
  .ln-gry img.amz2 { width: 46%!important; margin-bottom: 0; margin-top: 5%; }
  .ln-gry img.echo { width: 70%!important; margin-bottom: 0; }
  .ln-gry a { text-align: center; vertical-align: middle; font-weight: normal; font-size: 3vw; color:#222!important;white-space: nowrap; }
  .ln-gry a img { display: inline-block; width: 15%!important; vertical-align: middle; }
  div.ln-gry a img { display: inline-block; width: 15%!important; vertical-align: middle; }

  #slide2anchor { max-width: 980px; text-align: center; margin: 0 5% 10%; }
  #slide2anchor ul { display:flex; justify-content: space-between; }
  #slide2anchor ul li { width: 31%; }
  #slide2anchor ul li a { display: block; height: 13vw; line-height: 1.4; font-size: 3.8vw; color:#777; border-bottom: 2px solid #777; }
  #slide2anchor ul li a:hover,
  #slide2anchor ul li a.on { color:#eb5505; border-bottom: 2px solid #eb5505; text-decoration: none; }

  a.chargeDetail { height: 12vw; line-height: 12vw; display: block; background: #f3f3f3; color:#111!important; font-size: 3.2vw; position: relative; margin-top: 5%; }
  a.chargeDetail::after { content: '\FF1E'; position: absolute; top: 0; right: 5%; line-height: 12vw; font-size: 4vw; font-weight: bold; transform: scale(0.7, 1); }

  .tetherLnk { border: 2px solid #eb5505;  background: #fff url(https://www.au.com/content/dam/au-com/mobile/charge/pr/img/bg-question.png) left -17% center no-repeat; background-size: 40%; margin: 0; color:#eb5505!important; display: block;font-size: 4vw; font-weight: bold; padding: 4% 0; position: relative; }
  .tetherLnk::before { content:''; display: block; width: 0; height: 0; border-style: solid; border-width: 0 0 13vw 13vw; border-color: transparent transparent #eb5505 transparent; position: absolute; bottom: -1px; right: -1px; }
  .tetherLnk img { width: 20%!important; margin-bottom: 3%; }
  .tetherLnk img.quest { width: 8%!important; position: absolute; margin-bottom: 0; bottom: .3vw; right: .3vw; }
  .tetherLnk span { font-size: 4vw; font-weight: normal; }

  .pls {width: 16%; margin-top: -10vw; margin-bottom: -5vw; position: relative; z-index: 1; }

#netflixArea { text-align: center; }
#netflixArea h2 { margin-bottom: 10%; }
#netflixArea h3 { padding: 5% 6%; font-size: 6vw; line-height: 1.4; border-top: 2px solid #fff; border-bottom: 2px solid #fff; margin-bottom: 8%; }
#netflixArea p { font-size: 6vw; color: #eb5505; }
#netflixArea p span.note { color: #fff!important; font-size: 2.6vw; text-align: left; margin-bottom: 5%; line-height: 1.6; display: inherit; padding: 0 5%; }
#netflixArea p img { margin-bottom: 5%; width: 84%; }
#netflixArea p img.nfx { margin-bottom: 5%; width: 74%; }
#netflixArea p span.tx { display: block; margin-bottom: 8%;}
#netflixAreadetail { padding: 15% 5%; max-width: 980px; margin: 0 4vw; background-color: rgba(0,0,0,.7); }
#netflixAreadetail img { max-width: 765px; }

#netflixAreadetail ul.note { margin: 5% 0;}
#netflixAreadetail ul.note li a { font-size: 2.8vw;}
#netflixAreadetail ul.note li { text-align: center; }
ul.note li a { display: inline; }

#netflixArea a { text-align: center; color: #fff; margin-top: 8%; font-size: 3.2vw;}
#netflixArea a img { width: 5vw; }
#netflixArea a.btn { margin-top: 15%; max-width: 100%; }


#block4 h3 { text-align: center; font-size: 4.4vw; font-weight: bold; margin-bottom: 5%; }
#block4 ul { display: flex; margin: 0 3%; justify-content: space-between;  flex-wrap: wrap;}
#block4 ul li:not(:nth-child(3)) { width: 48%; text-align: center; border: solid #eb5505 1vw; position: relative; background-color: #fff; }
#block4 ul li a { display: block; padding: 7% 0; text-decoration: none!important; }
#block4 ul li a img { width: 30%; }
#block4 ul li:not(:nth-child(3)) p { font-size: 3vw; color:#333; margin-bottom: 3%; }
#block4 ul li:not(:nth-child(3)) p span { font-size: 3.8vw; color: #eb5505; font-weight: bold; }
#block4 ul li:not(:nth-child(3))::before { content:''; display: block; width: 0; height: 0; border-style: solid; border-width: 0 0 8vw 8vw; border-color: transparent transparent #eb5505 transparent; position: absolute; bottom: -1px; right: -1px; }
#block4 ul li:not(:nth-child(3))::after { content:'\FF1E'; display: block; position: absolute; bottom: -1vw; right: 0; color:#fff; font-weight: bold; transform: scale(0.7, 1); font-size: 4vw; }

#block4 ul li:nth-child(3) { width: 48%; text-align: center; }
#block4 ul li:nth-child(3) p{font-size: 2.8vw; margin: 3% auto 0;}

  #chargeWrap { margin: 10% 2% 3%; text-align: center; }
  .chargeBox { position: relative; margin: 0 3% 5%; padding: 10% 4vw; background-color: rgba(0,0,0,.7); background-image: url(https://www.au.com/content/dam/au-com/mobile/charge/pr/img/bg-content-head.png),url(https://www.au.com/content/dam/au-com/mobile/charge/pr/img/bg-content-bottom.png); background-repeat: no-repeat, no-repeat ; background-position: center top, center bottom 1px; background-size: 99.8% auto, 99.8% auto;}
  .chargeBox img { width: 100%; }

  .chargeBox .ribon img { position: absolute; top: 0; left: 0; width: 32%; }
  
  .chargeBox h3 { width: 96%; margin: 0 auto 10%;}
  .chargeBoxAccordionBox { background: #e6eaee; text-align: center; }
  .chargeBoxAccordionBox a { width: 12vw; padding-bottom: 3%; }
  .chargeBoxAccordionBox a img { width: 100%; }
  .chargeBoxAccordionBox a.open img { transform: rotate(180deg);}
  .chargeBoxAccordionBox .accContent { display: none;}
  .chargeBoxAccordionBox .accContent.open { display: block;}

  .slider1,.slider2,.slider3 { margin: 0 5% 3%; }
  .slick-slide img { width: 100%; }
  .slick-list { margin-bottom: 5%!important; }
  
  .slider1 p { padding: 5%; font-size: 3.4vw; text-align: center; }
  .slider1 p.note { padding: 3% 2% 5%; font-size: 2.8vw; text-align: center; }
  .sld1fx { background:rgba(1,22,45,.6); }
  
  .slick-slide h3 { padding: 5% 2%; text-align: center; color:#eb5505; font-size: 4vw; line-height: 1; border-bottom: 1vw solid #333; }
  
  .slider2 .slick-slide { padding: 4vw 4vw 10vw; background-color: rgba(0,0,0,.3); background-image: url(https://www.au.com/content/dam/au-com/mobile/charge/pr/img/bg-content-head.png),url(https://www.au.com/content/dam/au-com/mobile/charge/pr/img/bg-content-bottom.png); background-repeat: no-repeat, no-repeat ; background-position: center top, center bottom 1px; background-size: 99.8% auto, 99.8% auto; }
  .slider2 .slick-slide p { margin: 0 5% 5%; line-height: 1.8; text-align: center; font-size: 5vw; font-weight: normal; }
  .slider2 .slick-slide p.attention { font-size: 2.8vw; margin-bottom: 5%; text-align: center; }
  .slider2 h3 { padding: 4% 2%; border-radius: 1.6vw; width: 90%; margin: 10% auto 5%; text-align: center; font-size: 4.2vw; line-height: 1.2; border-bottom: none;background: linear-gradient(90deg, #f48221 20%, #ec5a07 80%) ; color: #fff; }
  .sld2flx > div:first-child { margin-bottom: 5vw;}
  .sld2flx > div p { font-size: 3.4vw; }
  .sld2flx > div p.note { font-size: 2.8vw; text-align: left; padding: 0;}
  .sld2flx > div img { width: 100%; margin-bottom: 5%; }
  .sld2mono { background: #e6eaee; margin: 0 auto 5%; padding-bottom: 3%; }
  .sld2mono .sld2monoInner { padding: 5% 6%; }
  a.btnOrangeSld2 { display: block; text-align: center; width: 90%; height: 10vw; line-height: 10vw; border-radius: 5vw; color: #fff; font-size: 3vw; background: linear-gradient(90deg, #f48221 30%, #ec5a07 70%) ; margin: 0 auto; color:#fff!important; position: relative; }
  a.btnOrangeSld2::after { content: '\FF1E'; position: absolute; right: 3%; transform: scale(.6,1); }
  .sld2mono ul.note li { color: #111; font-size: 11px; margin-bottom: 1px; line-height: 1.2; }
  .sld2mono div.flx { margin: 30px auto; }
  .sld2mono div.flx h4 { color: #eb5505; border: 1px solid #eb5505; height: 6vw; line-height: 5.6vw; margin-bottom: 5%; font-size: 3.2vw; text-align: center; }
  .sld2mono div.flx p { color: #111; padding: 0; margin: 0 0 8%; font-size: 3.2vw; }
  .sld2mono ul.note { margin: 0;}
  .sld2mono ul.note li { font-size: 2.4vw; line-height: 1.2; }
  .sld2mono p.sld2_3more { font-size: 3.4vw; color:#111;}

  .slider3 .slick-slide h3 { padding: 5%; text-align: center; color:#eb5505; font-size: 4.8vw; font-weight: bold; line-height: 1.2; border-bottom: none; }
  .slider3 .slick-slide { text-align: center;}
  .slider3 p { font-size: 3.2vw; font-weight: bold; margin-top: 5%; margin-bottom: 5%; }
  .slider3 .slick-slide .datalimit { font-size: 3vw; }
  .slider3 .slick-slide .datalimit img { width: 14%; margin-right: 3%; vertical-align: middle; display: inline-block; }
  
  .slick-dots { position: relative; display: block; width: 100%; padding: 0; margin: 0 auto 7%; list-style: none; text-align: center; line-height: 1!important; }
  .slick-dots li button { font-size: 0; line-height: 0; display: block; width: 10px; height: 10px; /*padding: 5px;*/ cursor: pointer; border: 0; outline: none; background: #777; border-radius: 10px; }
  .slick-dots li.slick-active button { background: #ea5404; }
  /*.slider2 .slick-dots li button { background: #333; }
  .slider2 .slick-dots li.slick-active button { background: #fff; }*/
  .slick-dots li button:before { content:''; }

  .slick-prev, .slick-next { font-size: 0; line-height: 0; position: absolute; bottom: 50%; display: block; padding: 0; cursor: pointer; color: transparent; border: none; outline: none; height: 12vw; width: 12vw; line-height: 12vw; text-align: center; background: linear-gradient(90deg, #f48221 30%, #ec5a07 70%); }
  
  .slick-prev:hover,
  .slick-next:hover { opacity: .5; }
  .slick-prev { left: -6%; z-index: 1; text-decoration: none!important; }
  .slick-next { right: -6%; z-index: 1; text-decoration: none!important; }
  .slick-prev:before { content: '\FF1C'; display: block; height: 12vw; width: 12vw; line-height: 12vw; transform: scale(0.7, 1); color:#fff!important; }
  .slick-next:before { content: '\FF1E'; display: block; height: 12vw; width: 12vw; line-height: 12vw; transform: scale(0.7, 1); color:#fff!important; }
  
  .slick-prev:before, 
  .slick-next:before { font-size: 5vw; 
    -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

  .slider2 .slick-prev, 
  .slider2 .slick-next { bottom: 50%; }

  ul.note { margin: 0 5%; }
  ul.note li { font-size: 2.8vw; line-height: 1.8; margin-bottom: 3%; text-align: left; }
  ul.note li.taCpc { text-indent: -2em; padding-left: 2em; margin-bottom: 1%;}

  .chargeBox ul.note { margin: 3% 0 10%; }

  .noteLnk { text-align: right; font-size: 2.8vw; margin: 0 5% 5%; }
  .noteLnk a { color:#fff!important; }
    
  a.btn { max-width: 84%; display: block; margin: 0 auto; height: 16vw; line-height: 16vw; border-radius: 8vw; font-weight: bold; color:#fff!important; text-align: center; font-size: 3.4vw; background: linear-gradient(90deg, #f48221 20%, #ec5a07 80%) ; position: relative; border: 2px solid #fff; }
  a.btn::before { content: '\FF1E'; line-height: 16vw; position: absolute; top: 0; right: 5%; display: block; transform: scale(0.7, 1); font-weight: bold; }

  #btmNoteList { max-width: 90%; margin: 5% auto; }
  #btmNoteList ul { text-align: left; font-size: 2.8vw; }
  #btmNoteList ul li { line-height: 1.6; margin-bottom: 2%; padding-left: 1em; text-indent: -1em; color: #333;}


  .chargeBox a.btn { width: 100%; max-width: 100%; }

  .mdlContent a { margin-top: 5%; }
  .mdlContent img.logo { margin-bottom: 5%; width: 50%; max-width: 220px; }
  .mdlContent img { width: 100%;}
  .mdlContent p { text-align: left; line-height: 1.4; font-size: 3.4vw;  }
  .mdlContent p.mdlHead1 { font-size: 4vw; }
  .mdlContent p.mdlHead2 { font-size: 4.4vw; margin-bottom: 5%; }

  #mdl12.mdlContent a.logoBox { border:#e6eaee 1px solid ; padding: 5%; font-size: 3.2vw; }
  #mdl12.mdlContent a.logoBox img { width: 80%; margin-bottom: 2%; }
  #mdl12.mdlContent a.logoBox span { display: block; color: #111!important; }
  #modalBox { border: 4px solid #333; max-width: 90%; margin: 0 auto; padding: 5%; }
  #clsmdl { padding-top: 5%; }
  #clsmdl img { width: 8%; }
  
  #fltCV { position: fixed; bottom: 0; left: 0; width: 100%; background: #fdeee6; padding: 3% 0; z-index: 5;}
  #fltCV ul { display: flex; justify-content: center; }
  #fltCV ul li { width: 50%; padding: 0 1%; max-width: 320px; }
  #fltCV ul li a { display: block; text-align: center; border-radius: 8vw; height: 16vw; line-height: 1.6; padding-top: 2.4vw; background: #eb5505; color:#fff; transition: .5s; text-decoration: none; position: relative; font-size: 3.4vw; }
  #fltCV ul li a::after { position: absolute; top: 33%; right:3%; content: '＞'; transform: scale(.6, 1); }
  #fltCV ul li:last-child a::after { content:''; display: block; height: 100%; width:22px; background:url(https://www.au.com/content/dam/au-com/mobile/charge/pr/img/icon-link-outer-w.png) no-repeat center center; background-size: 11px; transform: scale(1, 1); top: 0; }

  .btn-pageTop {
    bottom: 24vw!important;
  }
  
  a img.icon-outer { width: 2vw!important; display: inline!important; }
  
  .footerElem{ padding-bottom: calc(16vw + 7%)!important; background: #f3f3f3;}
}


@media screen and (max-width: 420px) and (min-width: 0px) { 
  h1 span { font-size: 5.6vw; }
}
    
.view-sp { display: none!important; }
.view-pc { display: block!important; }

@media screen and (min-width: 0px) and (max-width: 767px) {
	.view-sp { display: block!important; }
	.view-pc { display: none!important; }
}

ul.note li a { display: inline; }

body #contentsWrapper .contArea { max-width: 100%!important; padding-left: 0!important; padding-right: 0!important; position: relative!important; }

.fwb { font-weight: bold!important; }
.fcred { color: #FF0004!important; }
.fcorange { color:#eb5505!important; }
.fcgray { color:#666!important; }

.fsp80 { font-size: 80%; }
.fsp120 { font-size: 120%; }
.fsp140 { font-size: 140%; }
