#denki{color: #261f1e;} #denki img{ -webkit-backface-visibility: hidden!important; max-width: 100%;} @media screen and (min-width: 768px) { #mainvisual{width: 100%;background: #fbf139; text-align: center;} #mainvisual h1{max-width: 980px; margin: 0 auto;} .wrapLead{ text-align: center; font-size: 24px; font-weight: bold; padding: 20px 0; border: solid 3px #ff0800; color: #ff0800; /* margin-top: 50px; */ max-width: 980px; margin: 50px auto 0; border-radius: 10px; } #c01,#c02,#c03,#c04,#attArea,.cvArea,#qaArea,#inqArea{max-width: 980px; margin: 0 auto;} #c01{padding:50px 0 60px;} #c02,#c03,#c04{border: 1px solid #666;margin-bottom:55px;} #c02 .wrapH2,#c03 .wrapH2{background: #ededed; padding: 20px; font-weight: bold; text-align: center;border-bottom: 1px solid #666;} #c04 .wrapH2{background: #ededed; padding: 15px; font-weight: bold; text-align: center;border-bottom:none; cursor:pointer;} #c04 .wrapH2.on{border-bottom: 1px solid #666;} #c02 .wrapH2 h2,#c03 .wrapH2 h2{font-size: 24px; line-height: 1;} #c04 .wrapH2 h2{font-size: 24px; line-height: 1; line-height: 34px;} #c02 .innerContent{padding:30px;} #c02 .wrapH2{padding:10px;} #c02 .wrapH2 h2{line-height: 1.4;} #c02 .wrapH2 p{font-size: 16px; line-height: 1;} #c02 .wrapH2 p .num{display: inline-block; height: 16px; width: 16px; margin:0 1px;} #c02 ul.ulCond > li{font-size: 21px; font-weight: bold; line-height: 1.4; padding:10px 10px 10px 63px ; border-bottom: solid 1px #bebebe; margin-bottom: 6px;} #c02 ul.ulCond > li:nth-child(1){background:url(../images/img-c02-01.png) no-repeat; background-position: 10px 4px; } #c02 ul.ulCond > li:nth-child(2){background:url(../images/img-c02-02.png) no-repeat; background-position: 10px 4px; } #c02 ul.ulCond > li:nth-child(3){background:url(../images/img-c02-03.png) no-repeat; background-position: 10px 4px; padding-bottom: 14px;} #c02 ul.ulCond > li:nth-child(4){background:url(../images/img-c02-04.png) no-repeat; background-position: 10px 4px; } #c02 ul.ulCond > li:nth-child(5){background:url(../images/img-c02-05.png) no-repeat; background-position: 10px 4px; border: none; margin-bottom:0; } #c02 ul.ulCond > li .num{display: inline-block; height: 21px; width: 21px;line-height: 21px; margin:0 1px;} #c02 ul.ulCond > li .note{color: #666; /*font-size: 14px;*/ font-weight: normal;} #c02 ul.ulCond > li .btnArea{padding:20px 0 10px;margin:0 auto;} #c02 ul.ulCond > li:nth-child(1) .btnArea p{text-align:right;padding:20px 20px 0;font-size: 18px!important; font-weight: normal;} #c02 ul.ulCond > li:nth-child(3) .btnArea p,#c02 ul.ulCond > li:nth-child(5) .btnArea p{text-align:right;padding:20px 20px 0;font-size: 18px!important; font-weight: normal;} #c02 ul.ulCond > li:nth-child(1) .btnArea ul.ulBtn{width:100%;} /*#c02 ul.ulCond > li:nth-child(1) .btnArea ul.ulBtn li{width:50%; display: block; padding:0 5%; float:left;}*/ #c02 ul.ulCond > li:nth-child(1) .btnArea ul.ulBtn li a.btnBlue{ display: block; background: #555555; color: #fff; font-size: 18px; line-height: 62px; box-shadow: 3px 3px 0px 1.5px #888888; opacity: 1; transition: .5s; /* padding-left: 45%; */ margin: 0 12% 30px; text-align: center; } #c02 ul.ulCond > li:nth-child(3) .btnArea{text-align:center;} #c02 ul.ulCond > li:nth-child(3) .btnArea a.btnBlue{ display: block; background: #555555; color: #fff; font-size: 18px; line-height: 62px; box-shadow: 3px 3px 0px 1.5px #888888; opacity: 1; transition: .5s; /* padding-left: 45%; */ margin: 0 12%; text-align: center; } #c02 ul.ulCond > li:nth-child(5) .btnArea > div{position: relative; overflow: hidden;} #c02 ul.ulCond > li:nth-child(5) .btnArea ul.ulBtn{ margin:0 auto 20px;position: relative; float: left; left: 50%;width: 422px;} #c02 ul.ulCond > li:nth-child(5) .btnArea ul.ulBtn > li{display: block; margin:0; float:left;position: relative; left: -50%; } #c02 ul.ulCond > li:nth-child(5) .btnArea ul.ulBtn > li:nth-child(1){width:171px;margin-right: 40px;} #c02 ul.ulCond > li:nth-child(5) .btnArea ul.ulBtn > li:nth-child(2){width:211px;} #c02 ul.ulCond > li:nth-child(5) .btnArea ul.ulBtn > li img{width:100%; margin:0 auto;} #c02 ul.ulCond > li:nth-child(5) .btnArea a#auPayBtn{ padding-right: 18px; /* display: block; background: #555555; color: #fff; font-size: 18px; line-height: 62px; box-shadow: 3px 3px 0px 1.5px #888888; opacity: 1; transition: .5s; margin: 0 12% 20px; text-align: center; padding: 0; */ } #c02 ul.ulCond > li:nth-child(5) .btnArea a#auPayBtn::after{ content: '\FF1E'; transform: scale(1,.6) rotate(90deg); right: 0; top: 50%; margin-top: -1.9vw; position: absolute; height: 3.8vw; line-height: 3.8vw; } #c02 ul.ulCond .btnArea a.btnBlue:hover, #c02 ul.ulCond .btnArea a.btnBlue:active, #c02 ul.ulCond > li:nth-child(5) .btnArea a:hover img, #c02 ul.ulCond > li:nth-child(5) .btnArea a:active img { opacity: .6!important; transition: .5s!important; text-decoration: none!important;} #c02 ul.ulCond > li .btnArea .ulTxtLink {display: flex; margin: 0 auto;} #c02 ul.ulCond > li:nth-child(1) .btnArea .ulTxtLink {width: 50%;} #c02 ul.ulCond > li:nth-child(3) .btnArea .ulTxtLink {width: 90%;} #c02 ul.ulCond > li:nth-child(5) .btnArea .ulTxtLink {width: 40%;} #c02 ul.ulCond > li .btnArea .ulTxtLink > li{font-size: 16px; font-weight: normal; width: 50%; text-align: center;} #c02 ul.ulCond > li:nth-child(1) .btnArea .ulTxtLink > :nth-child(1){width: 65%;} #c02 ul.ulCond > li:nth-child(1) .btnArea .ulTxtLink > :nth-child(2){width: 35%;} #c02 ul.ulCond > li:nth-child(5) .btnArea .ulTxtLink > :nth-child(1){width: 75%;} #c02 ul.ulCond > li:nth-child(5) .btnArea .ulTxtLink > :nth-child(2){width: 25%;} #c02 ul.ulCond > li:nth-child(3) .btnArea .ulTxtLink > li:nth-child(1){width: 45%;} #c02 ul.ulCond > li:nth-child(3) .btnArea .ulTxtLink > li:nth-child(2){width: 20%;} #c02 ul.ulCond > li:nth-child(3) .btnArea .ulTxtLink > li:nth-child(3){width: 35%;} #c02 ul.ulCond > li .btnArea .ulTxtLink > li a.linkblank{padding-right: 18px;} .anchorBlock{max-width: 980px; margin: 0 auto; padding:0 0 55px; text-align: center;} a.anchor{padding-right: 18px;} a.anchor::after{ content: '\FF1E'; transform: scale(1,.6) rotate(90deg); right: 0; top: 50%; margin-top: -1.9vw; position: absolute; height: 3.8vw; line-height: 3.8vw; } #c03 .innerContent{padding:45px 65px; color: #333;} #c03 table{width: 100%; border: 1px solid #666; border-collapse: collapse;} #c03 table thead th{background: #fffde2; text-align: center; font-weight: bold; color: #261f1e; line-height: 1.4;padding:10px} #c03 table th,#c03 table td{vertical-align: middle;border-right: 1px solid #666; border-bottom:1px solid #666; border-collapse: collapse; } #c03 table td{padding:20px;} #c03 table td.date{padding: 10px; text-align: center;} #c03 table th:last-child,#c03 table td:last-child{border-right: none;} #c03 table tr:last-child td{border-bottom:none;} #c03 .ulNote{margin-top: 10px;} #c03 .ulNote li{font-size: 12px; line-height: 1.4;} #c04 p.lead{text-align: center; margin-top: 10px;} #c04 .innerContent{padding:35px 38px 40px; } #c04 ul li{display: block; float: left;} #c04 ul li:nth-child(1){width: 34.4%;} #c04 ul li:nth-child(2){width: 32.3%;} #c04 ul li:nth-child(3){width: 33.3%;} #c04 ul li:nth-child(1) img{width: 310px;} #c04 ul li:nth-child(2) img{width: 290px;} #c04 ul li:nth-child(3) img{width: 300px;} #c04 .shortcut{border:1px solid #666; border-radius: 5px;padding:14px; text-align: center; margin-top: 55px;} #c04 .shortcut img{width:870px;} #c04 .note{text-align: right;margin-top: 5px;} #attArea{font-size: 14px;} #attArea .tit{font-weight: bold; line-height: 1.4;} #attArea ul{margin-bottom:30px;} #attArea ul li{ line-height: 1.4; text-indent: -14px; padding-left:14px; } #attArea ul li a{display: inline;} #attArea table{width: 100%; border: 1px solid #626262; border-collapse: collapse;margin-bottom: 10px;} #attArea table th{background: #ededed; text-align: left; font-weight: bold; line-height: 1.4;padding:15px 20px;width: 28%;} #attArea table th .note{font-weight: normal; font-size: 12px;} #attArea table th,#attArea table td{border-right: 1px solid #626262; border-bottom:1px solid #626262; border-collapse: collapse; } #attArea table th:last-child,#attArea table td:last-child{border-right: none;} #attArea table td{ text-align: left; padding:15px 20px;} #attArea table td ul{margin: 0;} #attArea table td,#attArea table td ul li{line-height: 1.6;} #attArea table td.tit{background: #d7daf0;width: 17%; line-height: 1.4;} #attArea ul li a.linkblank{padding-right: 1.5%;} #attArea2{font-size: 14px; max-width: 980px; margin: 0 auto 55px;} #attArea2 .tit{font-weight: bold; line-height: 1;margin: 0 auto 10px;} #attArea2 .txt{line-height: 1.4; margin: 0 auto 10px;} #attArea2 a.linkblank{padding-right: 1.5%;} .cvArea{background: #fbf139;padding:50px 70px 70px; text-align: center;margin-bottom: 20px;font-size: 18px;} .cvArea h2{color:#261f1e; font-size: 24px; font-weight: bold; line-height:1.4; margin-bottom: 45px; } .cvArea .note{font-size: 14px; margin-bottom: 30px;} .cvArea ul {display: flex;} .cvArea ul li{ display: block; width: 48%; } .cvArea ul li:nth-child(1){margin-right: 2%;} .cvArea ul li:nth-child(2){margin-left: 2%;} .cvArea ul li a.btn,.cvArea.off ul li span{ display: block; background: #fff ; color: #261f1e; font-size: 24px; line-height:82px; height: 82px; box-shadow:3px 3px 0px 1.5px #626262; opacity:1; transition: .5s; padding-left: 10%; margin: 0 auto; text-align: center; font-weight: bold; } .cvArea ul li a.btn:hover,.cvArea ul li a.btn:active { opacity: .6; transition: .5s; text-decoration: none;} .cvArea ul li:nth-child(1) a,.cvArea.off ul li:nth-child(1) span{background:#fff url(../images/icon-web.png) no-repeat top left;background-size: auto 86%; background-position: 9% 50%; } .cvArea ul li:nth-child(2) a,.cvArea.off ul li:nth-child(2) span{background:#fff url(../images/icon-shop.png) no-repeat top left;background-size: auto 90%; background-position: 9% 50%; line-height: 1.2; padding: 3% 0 3% 9%; } .cvArea.off{} .cvArea.off ul li span{ display: block;opacity:.7 !important;box-shadow: none; } /* .cvArea ul li:nth-child(2) a{color: #261f1e;text-decoration:underline;} .cvArea ul li:nth-child(2) a:hover,.cvArea ul li:nth-child(2) a:active{text-decoration: none;} */ #qaArea{font-size: 14px;margin: 0 auto 55px;} #qaArea h2{font-weight: bold; line-height: 1; margin-bottom: 15px; font-size: 16px;} #qaArea ul li{ text-indent:-14px;padding-left: 14px; margin-bottom: 5px;} #qaArea ul li:nth-child(2n){margin-bottom: 15px;} #qaArea ul li.question span{ color: #0672E4; font-weight: bold;} #qaArea ul li.answer span{ color: #EF1F66;font-weight: bold;} #qaArea ul li a{text-indent: 0; padding: 0;} #inqArea{font-size: 14px;margin: 0 auto;} #inqArea h2{font-weight: bold; line-height: 1; margin-bottom: 15px; font-size: 16px;} #inqArea ul li{ text-indent:-14px;padding-left: 14px; margin-bottom: 10px;} #inqArea ul li .tit{font-weight: bold;} /*accordion*/ .detailBox{ border-top: none; position: relative; margin: 0 auto 5%; transition-duration: .3s; -webkit-transition-duration: .3s; -moz-transition-duration: .3s } .detailBox.on { width: 100% } .detailBox .btnAcordion{} .detailBox .btnAcordion:hover, .detailBox .btnAcordion:visited, .detailBox .btnAcordion:focus, .detailBox .btnAcordion:active{ text-decoration: none } .detailBox .btnAcordion::after { display: block; content: '＋'; position: absolute; right: 2%; top: 50%; font-size: 30px; height: 34px; width: 34px; line-height: 34px; margin-top: -17px; } .detailBox .btnAcordion.on::after { content: '－'; } .btnAcordion { display: block; font-weight: bold; text-decoration: none; position: relative; text-align: center } .btnAcordion.on { -webkit-box-shadow: none; box-shadow: none } .detailBoxInner{ display: none } /*---------------------floatBNR--------------------*/ #flBnr{background: #282423; width: 100%;} #flBnr .innerFlBnr{max-width: 980px; margin: 0 auto ; padding: 12px 0;} #flBnr .innerFlBnr p{ float: left; width: 44%; line-height: 1; text-align: left; padding-top: 22px; color: #fbf139; font-weight: bold; } #flBnr .innerFlBnr ul{ float: left; width: 50%; margin-right: 6%;} #flBnr .innerFlBnr ul li{width: 50%; float: left; display: block;} #flBnr .innerFlBnr ul li:first-child{text-align: right; padding-right: 5%;} #flBnr .innerFlBnr ul li:last-child{} /*#flBnr .ua-ios ul li,#flBnr .ua-and ul li{text-align: center;}*/ #flBnr .innerFlBnr ul li a.btn{ display: block; background: #fff; color: #261f1e; font-size: 14px; line-height: 54px; height: 54px; box-shadow: 3px 3px 0px 1.5px #626262; opacity: 1; transition: .5s; padding-left: 17%; margin: 0 auto; text-align: center; font-weight: bold; } #flBnr .innerFlBnr ul li:first-child a.btn{ background: #fff url(../images/icon-web.png) no-repeat top left; background-size: auto 90%; background-position: 8% 50%; } #flBnr .innerFlBnr ul li:last-child a.btn{ background: #fff url(../images/icon-shop.png) no-repeat top left; background-size: auto 90%; background-position: 8% 50%; line-height: 1.2; padding: 5.4% 0 3% 14%; } #flBnr .innerFlBnr ul li a.btn.linkblank::after { content: ''; transform: scale(1.5,1.5); position: absolute; top: 50%; right: 5%; padding-right: 0; margin-top: -4.5px; background-image: url(/etc.clientlibs/settings/wcm/designs/au-com/clientlib-site/resources/images/icon/icon_sprite.png); background-position: 1px -69px; width: 9px; height: 9px; background-size: 90.9px 83.7px; } } /*WIDE MONITOR*/ @media (min-width: 1200px){ /*---------------------floatBNR--------------------*/ #flBnr{width: calc(100% - 180px) ;} } @media screen and (max-width: 1199px) and (min-width: 980px) { } /* tablet */ @media screen and (max-width: 979px) and (min-width: 768px) { #c02 ul.ulCond > li:nth-child(1) .btnArea ul.ulBtn li a.btnBlue{ font-size: 2vw; } #c02 ul.ulCond > li:nth-child(3) .btnArea a.btnBlue{ font-size: 2vw; line-height: 62px; margin: 0 12%; } /*---------------------floatBNR--------------------*/ #flBnr .innerFlBnr { max-width: 980px; margin: 0 auto; padding: 1.8vw 0; } #flBnr .innerFlBnr ul { float: left; width: 53%; margin-right: 7%; } #flBnr .innerFlBnr p{ line-height: 2.8vw; font-size: 1.8vw; float: left; width: 40%; text-align: left; padding-left: 2%; padding-top: .6vw; } #flBnr .innerFlBnr ul li:first-child { text-align: right; padding-right: 3%; } #flBnr .innerFlBnr ul li a.btn { font-size: 16px; padding-left: 10%; } #flBnr .innerFlBnr ul li:first-child a.btn { background: #fff url(../images/icon-web.png) no-repeat top left; background-size: auto 60%; background-position: 6% 50%; padding-left: 11%; } #flBnr .innerFlBnr ul li:last-child a.btn { background: #fff url(../images/icon-shop.png) no-repeat top left; background-size: auto 60%; background-position: 6% 50%; line-height: 1.2; padding: 5% 0 3% 9%; } } /* SP */ @media screen and (max-width: 767px) and (min-width: 0px) { #contentsWrapper .contArea { padding: 0 3% 40px !important;} #denki{font-size: 3.4vw;} .wrapLead{ text-align: center; font-size: 4.4vw; font-weight: bold; padding: 3% 0; margin: 5% 3%; border: solid 3px #ff0800; color: #ff0800; border-radius: 1.6vw; } #c01,#c02,#c03,#c04,#attArea,#qaArea,#inqArea{margin: 5% 3%;} #c02,#c03,#c04{border: 1px solid #666;} #c02 .wrapH2,#c03 .wrapH2{background: #ededed; padding: 3%; font-weight: bold; text-align: center;border-bottom: 1px solid #666;} #c02 .wrapH2 h2,#c03 .wrapH2 h2{font-size: 4.6vw; line-height: 1;} #c04 .wrapH2{background: #ededed; padding: 3%; font-weight: bold; text-align: center;border-bottom:none; cursor: pointer;} #c04 .wrapH2.on{border-bottom: 1px solid #666;} #c04 .wrapH2 h2{font-size: 4.6vw; line-height: 4.6vw;} #c02 .innerContent{padding:3%;} #c02 .wrapH2{padding: 1.5%;} #c02 .wrapH2 h2{line-height: 1.4;} #c02 .wrapH2 p{ line-height: 1;} #c02 .wrapH2 p .num{display: inline-block; height: 3.4vw; width: 3.4vw; margin:0 1px;margin: 0 .15vw;} #c02 ul.ulCond > li{ font-weight: bold; line-height: 1.4; padding: 2% 0 2% 8%; border-bottom: solid 1px #bebebe; margin-bottom: 2%;} #c02 ul.ulCond > li:nth-child(1){background:url(../images/img-c02-01.png) no-repeat; background-position: 0 2vw; background-size: 5vw; } #c02 ul.ulCond > li:nth-child(2){background:url(../images/img-c02-02.png) no-repeat; background-position: 0 2vw; background-size: 5vw; } #c02 ul.ulCond > li:nth-child(3){background:url(../images/img-c02-03.png) no-repeat; background-position: 0 2vw; background-size: 5vw; /* padding-bottom: 4%;*/} #c02 ul.ulCond > li:nth-child(4){background:url(../images/img-c02-04.png) no-repeat; background-position: 0 2vw; background-size: 5vw; } #c02 ul.ulCond > li:nth-child(5){background:url(../images/img-c02-05.png) no-repeat; background-position: 0 2vw; background-size: 5vw; border: none; margin-bottom:0; } #c02 ul.ulCond > li .num{display: inline-block; height: 3.4vw; width: 3.4vw;line-height: 3.4vw;margin: 0 .15vw;} #c02 ul.ulCond > li .note{color: #666; font-weight: normal;} #c02 ul.ulCond > li .btnArea{padding:5% 0 2%;margin:0 auto;} #c02 ul.ulCond > li:nth-child(1) .btnArea p,#c02 ul.ulCond > li:nth-child(3) .btnArea p,#c02 ul.ulCond > li:nth-child(5) .btnArea p{text-align:right;padding: 0;font-size: 3.0vw; font-weight: normal;} #c02 ul.ulCond > li:nth-child(1) .btnArea ul.ulBtn{width:100%;} #c02 ul.ulCond > li:nth-child(1) .btnArea ul.ulBtn li{display: block;} /*#c02 ul.ulCond > li .btnArea a.btnBlue{ display: block; background: #261f1e; color: #fff; line-height: 15vw; font-size: 4.5vw; box-shadow: 0.4vw 0.4vw 0px 0.2vw #626262; opacity:1; transition: .5s; margin: 0 auto 3%; text-align: center; }*/ #c02 ul.ulCond > li .btnArea a.btnBlue{ display: block; background: #555555; color: #fff; line-height: 1.2; font-size: 3.8vw; box-shadow: 0.4vw 0.4vw 0px 0.2vw #888888; opacity:1; transition: .5s; margin: 0 5vw 3%; text-align: center; padding: 3vw 0; } #c02 ul.ulCond > li .btnArea a.btnBlue:active,#c02 ul.ulCond > li .btnArea a.btnBlue:hover{ opacity: .6; transition: .5s; text-decoration: none;} #c02 ul.ulCond > li:nth-child(5) .btnArea > div{position: relative; overflow: hidden;} #c02 ul.ulCond > li:nth-child(5) .btnArea ul.ulBtn{ margin:0 auto 3%;position: relative; float: left; left: 50%;} #c02 ul.ulCond > li:nth-child(5) .btnArea ul.ulBtn li{display: block; margin:0; float:left;position: relative; left: -50%; } #c02 ul.ulCond > li:nth-child(5) .btnArea ul.ulBtn li:nth-child(1){width:32vw;margin-right: 4vw;} #c02 ul.ulCond > li:nth-child(5) .btnArea ul.ulBtn li:nth-child(2){width:39vw;} #c02 ul.ulCond > li:nth-child(5) .btnArea ul.ulBtn li img{width:100%; margin:0 auto;} #c02 ul.ulCond > li .btnArea p a.linkblank{padding-right: 4%;} #c02 ul.ulCond > li:nth-child(5) .btnArea a#auPayBtn{ padding-right: 4%; /*display: block; background: #555555; color: #fff; line-height: 1.2; font-size: 3.8vw; box-shadow: 0.4vw 0.4vw 0px 0.2vw #888888; opacity:1; transition: .5s; margin: 0 5vw 3%; text-align: center; padding: 3vw 0; */ } #c02 ul.ulCond > li:nth-child(5) .btnArea a#auPayBtn::after{ content: '\FF1E'; transform: scale(1,.6) rotate(90deg); right: 0; top: 50%; margin-top: -1.9vw; position: absolute; height: 3.8vw; line-height: 3.8vw; } #c02 ul.ulCond > li .btnArea .ulTxtLink > li{font-size: 3.0vw; font-weight: normal; text-align: right;} #c02 ul.ulCond > li .btnArea .ulTxtLink > li a.linkblank{padding-right: 3vw;} .anchorBlock{margin: 5% 3%; text-align: center; font-size: 3vw;} a.anchor{padding-right: 3vw;} a.anchor::after{ content: '\FF1E'; transform: scale(1,.6) rotate(90deg); right: 0; top: 50%; margin-top: -1.9vw; position: absolute; height: 3.8vw; line-height: 3.8vw; } #c03 .innerContent{padding:2%; color: #333;} #c03 table{width: 100%; border: 1px solid #666; border-collapse: collapse;} #c03 table thead th{background: #fffde2; text-align: center; font-weight: bold; color: #261f1e; line-height: 1.4;padding: 2% 0; font-size: 2.6vw;} #c03 table thead th:nth-child(1){width: 20%;} #c03 table thead th:nth-child(2){width: 30%;} #c03 table thead th:nth-child(3){width: 50%;} #c03 table th,#c03 table td{vertical-align: middle;border-right: 1px solid #666; border-bottom:1px solid #666; border-collapse: collapse; font-size: 2.6vw; } #c03 table td{padding:2%;} #c03 table td.date{padding: 2%; text-align: center;} #c03 table th:last-child,#c03 table td:last-child{border-right: none;} #c03 table tr:last-child td{border-bottom:none;} #c03 table th span{font-weight: normal; font-size: 2.4vw;} #c03 .ulNote{margin-top: 2%;} #c03 .ulNote li{ line-height: 1.4; font-size: 2.6vw;} #c04 p.lead{text-align: center; margin-top: 3%;font-size: 2.6vw;} #c04 .innerContent{padding:5% 2%; } #c04 ul li{} #c04 ul li:nth-child(1){} #c04 ul li:nth-child(2){} #c04 ul li:nth-child(3){} #c04 .shortcut{border:1px solid #666; border-radius: 1.2vw;padding:2%; text-align: center; } #c04 .note{text-align: right;margin-top: 2%;font-size: 2.6vw;} #attArea{font-size: 2.6vw;} #attArea .tit{font-weight: bold; line-height: 1.4;} #attArea ul{margin-bottom:5%;} #attArea ul li{ line-height: 1.4; text-indent: -2.6vw; padding-left:2.6vw; } #attArea ul li a{display: inline;} #attArea table{width: 100%; border: 1px solid #626262; border-collapse: collapse;margin-bottom: 3%;} #attArea table th{background: #ededed; text-align: left; font-weight: bold; line-height: 1.4;padding:2% 1%;width: 20%;} /* .lineH{ writing-mode: tb-rl; -moz-writing-mode: vertical-rl; -o-writing-mode: vertical-rl; -webkit-writing-mode: vertical-rl; writing-mode: vertical-rl; display: inline-block; -webkit-box-sizing: border-box; box-sizing: border-box; text-align: left !important; -ms-text-combine-horizontal: digits; text-combine-upright: digits; -webkit-text-orientation: upright; text-orientation: upright; }*/ #attArea table th .note{font-weight: normal; } #attArea table th{} #attArea table th:first-child{border-bottom:1px solid #626262; border-collapse: collapse; } #attArea table td{border-right: 1px solid #626262;border-left: 1px solid #626262; border-bottom:1px solid #626262; border-collapse: collapse; } #attArea table th:nth-child(2),#attArea table th:last-child,#attArea table td:last-child{border-right: none;} #attArea table th:nth-child(2){border-bottom: none;} #attArea table td{ text-align: left; padding:2% 1%;} #attArea table td ul{margin: 0;} #attArea table td,#attArea table td ul li{line-height: 1.6;} #attArea table td.tit{background: #d7daf0;width: 20%; line-height: 1.4;} #attArea ul li a.linkblank{padding-right: 3vw;} .cvArea{background: #fbf139; padding: 10% 3%; text-align: center;margin-bottom: 5%; font-size: 3.6vw;} .cvArea h2{color:#261f1e; font-weight: bold; line-height:1.4; margin-bottom: 5%; font-size: 4.6vw;} .cvArea .note{line-height: 1.4; font-size: 2.6vw; margin-bottom: 5%;} .cvArea ul li{ display: block; } .cvArea ul li:nth-child(1){margin-bottom: 6%;} .cvArea ul li a.btn,.cvArea.off ul li span{display: block;background: #fff ; line-height: 15vw; font-size: 4.3vw; color: #261f1e;box-shadow: 0.4vw 0.4vw 0px 0.2vw #626262; opacity:1; transition: .5s;margin: 0 auto;text-align: center; padding-left: 6%;font-weight: bold;} .cvArea ul li a.btn:hover,.cvArea ul li a.btn:active { opacity: .6; transition: .5s; text-decoration: none;} .cvArea ul li:nth-child(1) a,.cvArea.off ul li:nth-child(1) span{isplay: block;background: #fff url(../images/icon-web.png) no-repeat top left;background-size: auto 80%; background-position: 12% 50%; } .cvArea ul li:nth-child(2) a,.cvArea.off ul li:nth-child(2) span{isplay: block;background: #fff url(../images/icon-shop.png) no-repeat top left;background-size: auto 80%; background-position: 12% 50%; line-height: 1.2; height: 15vw; padding: 3% 0 3% 6%; } .cvArea.off{} .cvArea.off ul li span{ display: block;opacity:.7 !important;box-shadow: none; } /*.cvArea ul li:nth-child(2) a{background: #fff url(../images/icon-shop.png) no-repeat top left;background-size: auto 80%; background-position: 19% 50%; padding-left: 45%;}*/ /*.cvArea ul li:nth-child(1) a{background: #fff url(../images/icon-web.png) no-repeat top left; background-size: auto 80%; background-position: 19% 50%; padding-left: 42%;}*/ #attArea2{ margin: 5% 3%;font-size: 2.6vw;} #attArea2 .tit{font-weight: bold; line-height: 1;margin: 0 auto 3%;} #attArea2 .txt{line-height: 1.4; margin: 0 auto 3%;} #attArea2 a.linkblank{ padding-right: 4%;} #qaArea{font-size: 2.6vw;} #qaArea h2{font-weight: bold; line-height: 1; margin-bottom: 2%; font-size: 3.4vw;} #qaArea ul li{ text-indent:-2.6vw;padding-left: 2.6vw; margin-bottom: 0;} #qaArea ul li:nth-child(2n){margin-bottom: 5%;} #qaArea ul li.question span{ color: #0672E4; font-weight: bold;} #qaArea ul li.answer span{ color: #EF1F66;font-weight: bold;} #qaArea ul li a{text-indent: 0; padding: 0;} #inqArea{font-size: 2.6vw;} #inqArea h2{font-weight: bold; line-height: 1; margin-bottom: 3%; font-size: 3.4vw;} #inqArea ul li{ text-indent:-2.6vw;padding-left: 2.6vw; margin-bottom: 3%;} #inqArea ul li .tit{font-weight: bold;} /*accordion*/ .detailBox{ border-top: none; position: relative; margin: 0 auto 5%; transition-duration: .3s; -webkit-transition-duration: .3s; -moz-transition-duration: .3s } .detailBox.on { /*width: 100%*/ } .detailBox .btnAcordion{} .detailBox .btnAcordion:hover, .detailBox .btnAcordion:visited, .detailBox .btnAcordion:focus, .detailBox .btnAcordion:active{ text-decoration: none } .detailBox .btnAcordion::after { display: block; content: '＋'; position: absolute; right: 2%; top: 50%; height: 4.6vw; width: 4.6vw; line-height: 4.6vw; margin-top: -2.3vw; } .detailBox .btnAcordion.on::after { content: '－'; } .btnAcordion { display: block; font-weight: bold; text-decoration: none; position: relative; text-align: center } .btnAcordion.on { -webkit-box-shadow: none; box-shadow: none } .detailBoxInner{ display: none } /*---------------------floatBNR--------------------*/ #flBnr{background: #282423; width: 100%;} #flBnr .innerFlBnr{ margin: 0 auto ; padding: 3% 0;} #flBnr .innerFlBnr p{ text-align: left; width: 100%; padding-left: 8%; line-height: 1; font-size: 3.2vw; margin: 0 auto; color: #fbf139; font-weight: bold; } #flBnr .innerFlBnr ul{ width: 100%; margin: 0 auto; /* padding-right: 11%; */ /* padding-left: 3%; */ padding: 2% 16% 2% 8%; } #flBnr .innerFlBnr ul li{width: 50%; float: left; display: block;} #flBnr .innerFlBnr ul li:first-child{text-align: right; padding-right: 3%;} #flBnr .innerFlBnr ul li:last-child{} #flBnr .innerFlBnr img{height:12vw; width: auto;} #flBnr .innerFlBnr{ margin: 0 auto ; padding: 5% 0;} #flBnr .innerFlBnr ul li a.btn{ display: block; background: #fff; line-height: 15vw; font-size: 2.6vw; color: #261f1e; box-shadow: 0.4vw 0.4vw 0px 0.2vw #626262; opacity: 1; transition: .5s; margin: 0 auto; text-align: center; padding-left: 6%; font-weight: bold; } #flBnr .innerFlBnr ul li a.btn:hover,#flBnr .innerFlBnr ul li a.btn:active { opacity: .6; transition: .5s; text-decoration: none;} #flBnr .innerFlBnr ul li:nth-child(1) a{ display: block; background: #fff url(../images/icon-web.png) no-repeat top left; background-size: auto 50%; background-position: 12% 50%; padding: 3% 0 3% 14%; line-height: 1.2; height: 10vw; padding: 6% 0 3% 12%; } #flBnr .innerFlBnr ul li:nth-child(2) a{ display: block; background: #fff url(../images/icon-shop.png) no-repeat top left; background-size: auto 50%; background-position: 7% 50%; padding: 3% 0 3% 14%; line-height: 1.2; height: 10vw; padding: 6% 0 3% 12%; } } @media screen and (min-width: 0px) and (max-width: 480px) { #flBnr .innerFlBnr p{ padding-left: 3%;} #flBnr .innerFlBnr ul{ padding: 2% 20% 2% 3%;} } .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; } } /*------------------Floatバナー-----------------*/ #flBnr{position: fixed; bottom: 0;z-index: 5;} /**/ .devcol2 p.orange { color: #eb5505!important;} .pink { color: #f3658e!important; } .red3 { color:#cc0000!important; } .white { color:#fff!important; } .orange { color:#f3507f!important; } .gray { color: #888888!important; } .red { color:#f24073!important; } .red2 { color:#ffb6c1!important; } .fwb { font-weight: bold!important; } .fwB { font-weight: bold!important; } .taC { text-align: center!important;} .fsL { font-size: 120%; } .fs60{font-size: 60%;} .fs70{font-size: 70%;} .fs85{font-size: 85%;} .fcRed{color:#FF0004!important;} a img{opacity: 1;transition: .5s;} a.linkblank,span.linkblank{position: relative;} a.linkblank::after { content: ''; transform: scale(1.5,1.5); position: absolute; top: 50%; right: 0; margin-top: -4.5px; background-image: url(/etc.clientlibs/settings/wcm/designs/au-com/clientlib-site/resources/images/icon/icon_sprite.png); background-position: -72px -60px; width: 9px; height: 9px; background-size: 90.9px 83.7px; } .cvArea a.linkblank::after,.cvArea span.linkblank::after,a.btn.linkblank::after { content: ''; transform: scale(1.5,1.5); position: absolute; top: 50%; right: 5%; padding-right:0; margin-top: -4.5px; background-image: url(/etc.clientlibs/settings/wcm/designs/au-com/clientlib-site/resources/images/icon/icon_sprite.png); background-position: 1px -69px; width: 9px; height: 9px; background-size: 90.9px 83.7px; } a.linkblankW{position: relative;} a.linkblankW::after { content: ''; transform: scale(1.5,1.5); position: absolute; top: 50%; right: -8%; margin-top: -4.5px; background-image: url(/etc.clientlibs/settings/wcm/designs/au-com/clientlib-site/resources/images/icon/icon_sprite.png); background-position: -27px -78px; width: 9px; height: 9px; background-size: 101px 93px; } .cvArea a.linkblankW::after { content: ''; transform: scale(1.5,1.5); position: absolute; top: 50%; right: -8%; margin-top: -4.5px; background-image: url(/etc.clientlibs/settings/wcm/designs/au-com/clientlib-site/resources/images/icon/icon_sprite.png); background-position: 1px -69px; width: 9px; height: 9px; background-size: 90.9px 83.7px; } a.btnBlue.linkblankW::after { content: ''; transform: scale(1.5,1.5); position: absolute; top: 50%; right: 5%; margin-top: -4.5px; background-image: url(/etc.clientlibs/settings/wcm/designs/au-com/clientlib-site/resources/images/icon/icon_sprite.png); background-position: -27px -78px; width: 9px; height: 9px; background-size: 101px 93px; } /*#c02 ul.ulCond > li:nth-child(1) .btnArea ul.ulBtn li:nth-child(1) a.btnBlue::after { content: '\FF1E'; transform: scale(.6,1); right: 3%; top: 50%; margin-top: -1.9vw; position: absolute; height: 3.8vw; line-height: 3.8vw; } */ .zoom-up { /*opacity:0; transform: scale(.6); -webkit-transform : scale(.6); transition: all 0.4s linear; -webkit-transition: all 0.4s linear;*/ } @keyframes anime1 { 0 { margin-left: 0; } 100% { margin-left: -67%; } } @-webkit-keyframes anime1 { 0 { margin-left: 0; } 100% { margin-left: -67%; } } @keyframes anime2 { 0 { margin-left: 0; } 100% { margin-left: -16.6%; } } @-webkit-keyframes anime2 { 0 { margin-left: 0; } 100% { margin-left: -16.6%; } } .boyon { animation-name: boyon; animation-duration: 1s; animation-timing-function: ease; } @keyframes boyon { 0 { transform: scale(1.3); -webkit-transform : scale(1.3); } 25% { transform: scale(0.9); -webkit-transform : scale(0.9); } 50% { transform: scale(1.1); -webkit-transform : scale(1.1); } 75% { transform: scale(0.96); -webkit-transform : scale(0.96); } 100% { transform: scale(1.0); -webkit-transform : scale(1.0); } } @-webkit-keyframes boyon { 0 { transform: scale(1.3); -webkit-transform : scale(1.3); } 25% { transform: scale(0.9); -webkit-transform : scale(0.9); } 50% { transform: scale(1.1); -webkit-transform : scale(1.1); } 75% { transform: scale(0.96); -webkit-transform : scale(0.96); } 100% { transform: scale(1.0); -webkit-transform : scale(1.0); } }