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;
    -moz-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: #000;*/ text-decoration: none;}
a:visited { /*color: #000;*/  text-decoration: none; }
a:hover { /*color: #000;*/ text-decoration: none;}
a:active { /*color: #000;*/ 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%; }

#contentsWrap { text-align: center; color:#333; }
#contentsWrap img{ -webkit-backface-visibility: hidden; }

@media screen and (min-width: 768px){
    #maincontArea { background: #f7f7f7; }
    #contentsWrapper .contArea {
        padding: 0 0 40px!important;
    }
    #appwrap { padding: 0 0 8%; }
    .appwrap h2 { font-size: 22px; font-weight: normal; margin-bottom: 30px; position: relative; }
    .appwrap h2 span { background: #f7f7f7; position: relative; z-index: 1; display: inline-block; padding-right: 10px; }
    .appwrap h2::after { content:''; position: absolute; top: 50%; right:0; width: 99%; display: block;  border-bottom: 1px solid #d1d1d1; }
    .appwrap h3 { font-size: 20px; font-weight: bold; margin: 0 auto 30px; position: relative; max-width: 720px; }
    .appwrap p.lead { font-size: 16px; margin-bottom: 50px; }
    .appbox { display: flex; justify-content: flex-start; margin: 0 auto 40px; max-width: 720px; flex-wrap: wrap; }
    .appbox .appicon { width: 75px; /*height: 20vw; border-radius: 4.4vw; overflow: hidden; box-shadow: 0 2px 2px 2px rgba(0,0,0,.1);*/ }
    .appbox .appicon img { width: 100%; }
    .appbox .apparticle { width: 580px; padding: 3px 20px 0;}
    .appbox .apparticle .apptit { font-size: 16px; font-weight: bold; margin-bottom: 10px; }
    .appbox .apparticle .apptxt { font-size: 14px; }
    .appbox .applnk { display: block; width: 60px; background: #eb5505; color: #fff; text-align: center; line-height: 77px; border-radius: 0 16px 16px 0; font-size: 18px; }

    .pc_link_box { padding-bottom: 40px; text-align: center; padding-top: 10px; }
    .pc_link_box a:hover { opacity: .6; }
    .pc_link_box img { width: 160px; margin: 0 20px; }
    .pc_link_box a.pcmodal { display: inline-block; width: 240px; margin: 0 auto; background: #eb5505; color: #fff!important; text-align: center; line-height: 48px; height: 48px; border-radius: 6px; font-size: 16px;  }

    #netflix .pc_link_box a,
    #applemusic .pc_link_box a, #amazon-prime .pc_link_box a, #amazon-shop .pc_link_box a { text-align: center; margin-bottom: 20px!important;}

    #appendix { padding: 60px 20px; background: #fff; }
    #featureapp { border: 2px solid #e5e5e5; border-bottom: 4px solid #e5e5e5; margin: 0 auto 60px; border-radius: 10px; overflow: hidden; text-align: center; display: flex; justify-content: space-between; align-items: center; max-width: 720px; }

    #featureappimg { width: 50%; }
    #featureappimg img { width: 100%; }
    #featureappinner { padding: 40px; width: 50%; }
    #featureappinner a { font-size: 18px; font-weight: bold; }
    #featureappinner p { font-size: 16px; margin-top: 5%; text-align: left; }
    #qrarea p { width: 64%; margin: 0 auto 20px; font-size: 16px; text-align: center; }
    #qrcode { width: 150px; margin: 0 auto; }
    #qrcode canvas { width: 100%; }


    #adMovBox .attention { line-height: 1.6;}
    #adMovBox .attention .appinfohead { padding: 40px; background: #f3f3f3; text-align: left; display: flex; justify-content: space-between; align-items: center; overflow: hidden; }
    #adMovBox .attention .appinfohead .appicon { width: 25%; }
    #adMovBox .attention .appinfohead .appicon img { width: 100%; }
    #adMovBox .attention .appinfohead .appinfotext { width: 75%; padding-left: 20px; }
    #adMovBox .attention .appinfohead p.appname { font-size: 18px; font-weight: bold; margin-bottom: 15px; }
    #adMovBox .attention .appinfohead p.apptxt { font-size: 16px; }
    #adMovBox .attention .attentioninner { padding: 40px; text-align: center; }
    #adMovBox .attention .attentionhowtouse { padding-bottom: 30px; padding-top: 0; }
    #adMovBox .attention .attentionhowtouse p.attentionhowtotit { font-size: 18px; text-align: center; margin-bottom: 15px; font-weight: bold; }
    #adMovBox .attention .attentionhowtouse p.attentionhowtotxt { font-size: 16px; text-align: left; }
    #adMovBox .attention .attentionbtnarea { padding: 40px 0; text-align: center; border-top: 1px solid #ccc; }
    #adMovBox .attention .attentionbtnarea p { font-size: 18px; margin-bottom: 10px; }
    #adMovBox .attention .attentionbtnarea p.bicytxt2 { font-size: 16px; padding: 10px 0 0; margin-right: 20%; margin-left: 20%; text-indent: -2em; text-align: left; }
    #adMovBox .attention .attentionbtnarea p.bicytxt { font-size: 16px; margin-bottom: 30px; padding: 10px 0; margin-right: 20%; margin-left: 20%; text-indent: -2em; text-align: left;  }
    #adMovBox .attention .attentionbtnarea a { display: block; height: 60px; line-height: 60px; color:#fff; font-weight: bold; width: 420px; margin: 0 auto; border-radius: 30px;  background: #eb5505; text-decoration: none!important; }
    #adMovBox .attention .attentionbtnarea a.txtlnk{ display: inline; height: auto; line-height: 1.4; color:dodgerblue; font-weight: normal; width: auto; margin: 0; border-radius:0;  background: none; text-decoration: underline!important; }
    #adMovBox .attention .attentionbtnarea a.line2 { height: 80px; line-height: 1.6; width: 420px; border-radius: 45px; padding-top: 15px; }

    #adMovBox .attention .attentionnote { border: 1px solid #d1d1d1; padding: 20px; text-align: left;}
    #adMovBox .attention .attentionnote p { font-size: 14px; font-weight: bold; padding: 10px 0 10px 40px; background: url(/content/dam/au-com/support/service/mobile/guide/app/img/icon-alert.png) no-repeat left center; background-size: 34px; margin-bottom: 10px; }
    #adMovBox .attention .attentionnote ul { margin-bottom: 20px; }
    #adMovBox .attention .attentionnote ul li { font-size: 14px; text-align: left; padding-left: 1em; text-indent: -1em; }
    #adMovBox .attention .attentioninner .cls { display: inline-block; width: 30px; margin: 20px auto 0; }
    #adMovBox .attention .attentioninner .cls img { width: 100%; }

    #adMovBox #netflix .attentionbtnarea a, #adMovBox #amazon-shop .attentionbtnarea a, #adMovBox #amazon-prime .attentionbtnarea a { margin-bottom: 50px!important; }
    .nfflow { font-size: 16px!important; text-align: left; padding: 0 0 20px; }
    .block3Note { max-width: 710px; margin: 0 auto; }
    .block3Note li { font-size: 12px; text-align: left; margin-bottom: 60px;}
}

@media all and (-ms-high-contrast: none) {}
@media screen and (min-width: 1200px) {}
@media screen and (min-width: 768px) and (max-width: 1200px) {}
@media screen and (min-width: 980px) and (max-width: 1200px) {}
@media screen and (min-width: 768px) and (max-width: 979.98px) {}

@media screen and (min-width: 0px) and (max-width: 767.98px) {
    #maincontArea { background: #f7f7f7; }
    #contentsWrapper .contArea {
        padding: 0 0 40px!important;
    }
    #appwrap { padding: 0 3% 8%; }
    .appwrap h2 { font-size: 5vw; font-weight: normal; margin-bottom: 10%; position: relative; }
    .appwrap h2 span { background: #f7f7f7; position: relative; z-index: 1; display: inline-block; padding-right: 3%; }
    .appwrap h2::after { content:''; position: absolute; top: 50%; right:0; width: 99%; display: block;  border-bottom: 2px solid #d1d1d1; }
    .appwrap h3 { font-size: 4.6vw; font-weight: bold; margin-bottom: 10%; position: relative; }
    .appwrap p.lead { font-size: 3.8vw; margin-bottom: 10%; }
    .appbox { display: flex; justify-content: flex-start; margin-bottom: 10%; flex-wrap: wrap; }
    .appbox .appicon { width: 22%; /*height: 20vw; border-radius: 4.4vw; overflow: hidden; box-shadow: 0 2px 2px 2px rgba(0,0,0,.1);*/ }
    .appbox .appicon img { width: 100%; }
    .appbox .apparticle { width: 63%; padding: 0 3%;}
    .appbox .apparticle .apptit { font-size: 3.6vw; font-weight: bold; margin-bottom: 2%; }
    .appbox .apparticle .apptxt { font-size: 3vw; }
    .appbox .applnk { display: block; width: 15%; background: #eb5505; color: #fff!important; text-align: center; line-height: 20vw; border-radius: 0 5vw 5vw 0; font-size: 3.4vw; }

    .pc_link_box { padding-bottom: 10%; padding-left: 24%; padding-top: 3%; text-align: left; }
    #netflix .pc_link_box,
    #applemusic .pc_link_box, #amazon-prime .pc_link_box, #amazon-shop .pc_link_box{ padding-bottom: 10%; padding-left: 0; padding-top: 3%; text-align: left; }
    .pc_link_box a { display: inline; }
    .pc_link_box img { width: 40%; margin: 0 2%; }
    .pc_link_box a.pcmodal { display: block; width: 60%; background: #eb5505; color: #fff!important; text-align: center; line-height: 8vw; height: 8vw; border-radius: 2vw; font-size: 3.4vw;  }

    #netflix .pc_link_box a,
    #applemusic .pc_link_box a, #amazon-prime .pc_link_box a, #amazon-shop .pc_link_box a { text-align: center; margin-bottom: 5%!important;}


    #appendix { padding: 15% 3%; background: #fff; }
    #featureapp { border: 2px solid #e5e5e5; border-bottom: 4px solid #e5e5e5; margin-bottom: 12%; border-radius: 2vw; overflow: hidden; text-align: center; }
    #featureappinner { padding: 5%; }
    #featureappimg img { display: none; }
    #featureappinner a { font-size: 4.2vw; font-weight: bold; }
    #featureappinner p { font-size: 4vw; margin-top: 5%; text-align: left; }
    #qrarea p { width: 64%; margin: 0 auto 8%; font-size: 4vw; }
    #qrcode { width: 50%; margin: 0 auto; }
    #qrcode canvas { width: 100%; }

    #adMovBox .attention { line-height: 1.6;}
    #adMovBox .attention .appinfohead { padding: 5%; background: #f3f3f3; text-align: left; display: flex; justify-content: space-between; align-items: center; overflow: hidden; }
    #adMovBox .attention .appinfohead .appicon { width: 25%; }
    #adMovBox .attention .appinfohead .appicon img { width: 100%; }
    #adMovBox .attention .appinfohead .appinfotext { width: 75%; padding-left: 5%; }
    #adMovBox .attention .appinfohead p.appname { font-size: 3.2vw; font-weight: bold; margin-bottom: 2%; }
    #adMovBox .attention .appinfohead p.apptxt { font-size: 3vw; }
    #adMovBox .attention .attentioninner { padding: 5%; text-align: center; }
    #adMovBox .attention .attentionhowtouse { padding-bottom: 5%; padding-top: 2%; }
    #adMovBox .attention .attentionhowtouse p.attentionhowtotit { font-size: 4vw; text-align: center; margin-bottom: 3%; font-weight: bold; }
    #adMovBox .attention .attentionhowtouse p.attentionhowtotxt { font-size: 3.4vw; text-align: left; }
    #adMovBox .attention .attentionbtnarea { padding: 6% 0; text-align: center; border-top: 1px solid #ccc; }
    #adMovBox .attention .attentionbtnarea p { font-size: 3.6vw; margin-bottom: 3%; }
    #adMovBox .attention .attentionbtnarea p.bicytxt2 { margin-bottom: 2%; padding: 2% 0 0; margin-right: 20%; margin-left: 20%; text-indent: -2em; text-align: left;  }
    #adMovBox .attention .attentionbtnarea p.bicytxt { margin-bottom: 5%; padding: 2% 0; margin-right: 12%; margin-left: 20%; text-indent: -2em; text-align: left;  }
    #adMovBox .attention .attentionbtnarea a {font-size: 3.4vw; display: block; height: 12vw; line-height: 12vw; color:#fff; font-weight: bold; width: 100%; margin: 0 auto; border-radius: 6vw;  background: #eb5505; text-decoration: none!important; }
    #adMovBox .attention .attentionbtnarea a.txtlnk{ display: inline; height: auto; line-height: 1.4; color:dodgerblue; font-weight: normal; width: auto; margin: 0; border-radius:0;  background: none; text-decoration: underline!important; }
    #adMovBox .attention .attentionbtnarea a.line2 { height: 16vw; line-height: 1.6; border-radius: 8vw; padding-top: 2.6vw; }
    #adMovBox .attention .attentionnote { border: 1px solid #d1d1d1; padding: 4%; text-align: left;}
    #adMovBox .attention .attentionnote p { font-size: 2.6vw; font-weight: bold; padding: 3% 0 3% 10vw; background: url(/content/dam/au-com/support/service/mobile/guide/app/img/icon-alert.png) no-repeat left center; background-size: 8vw; margin-bottom: 3%; }
    #adMovBox .attention .attentionnote ul { margin-bottom: 3%; }
    #adMovBox .attention .attentionnote ul li { font-size: 2.6vw; text-align: left; padding-left: 1em; text-indent: -1em; }
    #adMovBox .attention .attentioninner .cls { display: inline-block; width: 7%; margin: 5% auto 0; }
    #adMovBox .attention .attentioninner .cls img { width: 100%; }
    .nfflow { font-size: 3.4vw!important; text-align: left; padding: 10% 0 5%; }

    .block3Note li { font-size: 2.8vw; text-align: left; margin-bottom: 8%;}
}

.view-pc { display: block!important; }
.view-sp { display: none!important; }

@media screen and (min-width: 0px) and (max-width: 767px) {
	.view-pc { display: none!important; }
	.view-sp { display: block!important; }
}

#adMovBox { display:none; position: absolute; top: 0; width: 94%; margin: 5% 3% 0; height: 0; }
#adMovBox.showMov { display:block; z-index: 1000;}
#adMovBox .attention { border-radius: 10px; max-width: 640px; margin: 0 auto; background: #fff; overflow: hidden; }
#adMovBoxInner { max-width: 640px; margin: 0 auto;  }

#floatbg { display: none; text-align: center; background: rgba(0,0,0,.7); z-index: 999; width: 100%; height: 100%; height: 100vh; position: fixed; top: 0; }

.fwB { font-weight: bold!important; }

.app { display: none; }
#smps { display: none; }
#smpsp { display: none; }
#smpspdb { display: none; }
.pc_link_box { display: none; width: 100%; border-bottom: 2px solid #d3d3d3; }
.pc_link_box a.pcmodal {}
