@charset "utf-8";
.top-mainvisual {
 width: 100%;
 height: 310px;
 overflow: hidden;
 position: relative;
 padding: 0 40px;
 background: top center / contain url(/contents/cdn-img/top/static/bg_security_01.png) no-repeat #f0f2fe;
}
.top-mainvisual .top-picture-bg {
 position: absolute;
 left: 0;
 top: 0;
 width: 100%;
 z-index: 0;
}
.top-mainvisual .top-picture-bg img {
 width: 100%;
 max-width: initial;
 height: auto;
}
.top-mainvisual-inner {
 position: relative;
 max-width: 1090px;
 width: 100%;
 height: 100%;
 margin: 0 auto;
 display: flex;
 justify-content: space-between;
 align-items: center;
 z-index: 10;
}
.top-mainvisual-txt {
 margin-left: 30px;
}
.top-mainvisual-cnt, .top-mainvisual-login {
 display: table-cell;
 vertical-align: middle;
}
.top-mainvisual-cnt > p {
 padding-left: 135px;
}
.top-mainvisual-cnt .top-picture-tit img {
 max-width: 100%;
 height: auto;
}
.top-mainvisual-cnt .label {
 display: inline-block;
 margin-left: 135px;
 padding: 5px 16px 5px 18px;
 background: #2d96cd;
 border-radius: 3px;
 color: #fff;
 font-size: 1.6rem;
 letter-spacing: 0.07em;
}
.top-mainvisual-cnt .label + .tit {
 margin-top: 27px;
}
.top-mainvisual-cnt .tit {
 color: #fff;
 font-size: 3.5rem;
 font-weight: bold;
 letter-spacing: 0.08em;
 text-shadow: 0px 0px 10px rgba(0, 0, 0, .3);
 line-height: 1.5;
}
.top-mainvisual-cnt .tit .tit-marker {
 display: inline-block;
 padding: 0 0 2px 5px;
 background: -webkit-linear-gradient(transparent 77%, rgba(0, 88, 160, 0.5) 77%);
 background: -moz-linear-gradient(transparent 77%, rgba(0, 88, 160, 0.5) 77%);
 background: -o-linear-gradient(transparent 77%, rgba(0, 88, 160, 0.5) 77%);
 background: -ms-linear-gradient(transparent 77%, rgba(0, 88, 160, 0.5) 77%);
 background: linear-gradient(transparent 77%, rgba(0, 88, 160, 0.5) 77%);
 line-height: 1;
}
.top-mainvisual-cnt .tit .tit-em {
 font-size: 4.5rem;
 line-height: 0;
 letter-spacing: 0;
}
.top-mainvisual-cnt .tit .tit-br-pcHide {
 display: none;
}
.top-mainvisual-cnt .tit .tit-br-pcHide + .tit-marker {
 padding-left: 0;
}
.top-mainvisual-cnt .txt {
 color: #fff;
 font-size: 1.8rem;
 line-height: 150%;
 text-shadow: 0px 0px 10px rgba(0, 0, 0, .3);
 margin-top: 20px;
}
.top-mainvisual-cnt .btn {
 margin-top: 25px;
}
.top-mainvisual-cnt .btn > a {
 display: inline-block;
 background-color: rgba(255, 255, 255, 0.9);
 color: #0058a0;
 letter-spacing: 0.07em;
 border-radius: 20px;
 position: relative;
 padding: 7px 55px 7px 45px;
 -webkit-transition: all 0.2s ease-out;
 -moz-transition: all 0.2s ease-out;
 -o-transition: all 0.2s ease-out;
 -ms-transition: all 0.2s ease-out;
 transition: all 0.2s ease-out;
}
.top-mainvisual-cnt .btn > a:hover {
 text-decoration: none;
 background-color: rgba(255, 255, 255, 0.25);
}
.top-mainvisual-cnt .btn > a:before {
 font-family: "icon";
 font-style: normal;
 font-weight: normal;
 font-variant: normal;
 text-transform: none;
 line-height: 1;
 speak: none;
 -webkit-font-smoothing: antialiased;
 -moz-osx-font-smoothing: grayscale;
 overflow: hidden;
 content: "\EA03";
 position: absolute;
 right: 14px;
 top: 50%;
 width: 6px;
 height: 10px;
 font-size: 1rem;
 margin-top: -5px;
}
.top-mainvisual-login {
	margin-right: 20px;
}
.top-loginarea {
 width: 230px;
 background-color: rgba(255, 255, 255, 0.9);
 border-radius: 5px;
 text-align: center;
 display: none;
 -webkit-box-shadow: 0px 0px 5px 0px rgba(102, 102, 102, 0.3);
 box-shadow: 0px 0px 5px 0px rgba(102, 102, 102, 0.3);
}
.top-loginarea .tit {
 padding-top: 25px;
 font-size: 1.6rem;
 font-weight: bold;
}
.top-loginarea .txt {
 margin-top: 15px;
}
.top-loginarea .m-linkList {
 margin-top: 25px;
}
.top-mainvisual-link {
 margin-left: 120px;
 width: 240px;
}
.top-mainvisual .top-picture-bg {
 left: calc(50% - 600px);
 top: 40px;
 width: 1200px;
}
.top-mainvisual-login [data-js="top-haveaccount-before"] {
 height: 200px;
}
.top-mainvisual-login [data-js="top-haveaccount-before"] .m-btnListS {
 margin-top: 8px;
}
.top-mainvisual-login [data-js="top-haveaccount-after"] {
 height: 180px;
}
.top-mainvisual-login [data-js="top-haveaccount-after"] .m-btnListS {
 margin-top: 20px;
}
.txt-main {
 margin-bottom: 30px;
 width: 433px;
}
.top-mainvisual-txt .btn {
 margin: 0 auto;
 width: 215px;
}
@media screen and (max-width: 1220px) {
 .top-mainvisual {
  background-size: cover;
 }
}
@media screen and (max-width: 1199px) {
 .top-mainvisual {
  padding: 0 20px;
 }
 .top-mainvisual-cnt > p {
  padding-left: 0;
 }
 .top-mainvisual-cnt .label {
  margin-left: 0;
 }
 .top-mainvisual-cnt .label + .tit {
  margin-top: 22px;
 }
 .top-mainvisual-cnt .label + .tit + .txt {
  margin-top: 15px;
 }
 .top-mainvisual-cnt .label + .tit + .txt + .btn {
  margin-top: 20px;
 }
 .top-mainvisual-login {
  width: 230px;
 }
 .top-loginarea {
  -webkit-box-shadow: 0px 0px 5px 0px rgba(102, 102, 102, 0.3);
  box-shadow: 0px 0px 5px 0px rgba(102, 102, 102, 0.3);
 }
 .top-mainvisual .top-picture-bg {
  top: 30px;
 }
 .top-mainvisual .top-picture-bg img {
  width: 100%;
 }
}
.logo-paypay {
 margin-bottom: 20px;
 width: 154px;
}
.txt-paypay {
 margin-bottom: 30px;
 font-size: 2.4rem;
 font-weight: bold;
 color: #0058a0;
}
.btn-paypay {
 width: 170px;
 display: block;
}
@media screen and (max-width: 1150px) {
 .top-mainvisual-login {
		margin-right: 40px;
 }
}
@media screen and (max-width: 1100px) {
 .top-mainvisual-link {
  margin-left: 0;
 }
}
@media screen and (max-width: 1080px) {
 .top-mainvisual {
  height: 350px;
  background: top center / 962px 350px url(/contents/cdn-img/top/static/bg_security_01_tb.png) no-repeat #f0f2fe;
 }
 .top-mainvisual-txt{
  margin-left: 0;
 }
/* .top-mainvisual-login {
		margin-right: 0;
 }*/
}
@media screen and (max-width: 1000px) {
 .txt-main {
  width: 237px;
 }
 .top-mainvisual-txt .btn {
  margin: 0;
  width: 173px;
 }
}
@media screen and (min-width: 820px) and (max-width: 1199px) {
 .top-mainvisual .top-picture-bg img {
  height: 100%;
 }
}
@media screen and (max-width: 819px) {
 .top-mainvisual {
  height: 350px;
  padding: 0 20px;
 }
 .top-mainvisual-txt {
  margin-left: 0;
 }
 .top-mainvisual-cnt, .top-mainvisual-login {
  width: 100%;
 }
 .top-mainvisual-cnt {
  padding: 0;
  text-align: center;
  padding-bottom: 0;
 }
 .top-mainvisual-cnt > p {
  padding-left: 0;
 }
 .top-mainvisual-cnt .label {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  padding: 5px 0;
  border-radius: 0;
 }
 .top-mainvisual-cnt .label + .tit {
  margin-top: 40px;
 }
 .top-mainvisual-cnt .label + .tit + .txt + .btn {
  margin-top: 25px;
 }
 .top-mainvisual-cnt .txt {
  display: none;
 }
 .top-mainvisual-login {
  margin-right: 0;
  display: block;
  min-width: 200px;
  width: auto;
 }
 .top-loginarea {
  width: 100%;
 }
 .top-mainvisual-link {
  width: 220px;
 }
 .logo-paypay {
  width: 135px;
 }
 .txt-paypay {
  font-size: 2.1rem;
 }
 .top-mainvisual .top-picture-bg {
  display: none;
 }
 .top-mainvisual-inner {
  padding: 0;
  max-width: inherit;
 }
}
@media(max-width:659px) {
 .top-mainvisual {
  padding: 0;
  height: auto;
  background: top center / 659px 222px url(/contents/cdn-img/top/static/bg_security_01_sp.png) no-repeat #fff;
 }
 .top-mainvisual-inner {
  padding: 0;
  display: block;
 }
 .top-mainvisual-txt {
  margin: 40px 0 33px 16px;
 }
 .top-mainvisual-link {
  width: 140px;
  position: relative;
  left: 18%;
 }
 .txt-main {
  width: 125px;
 }
 .top-mainvisual-login {
  position: static;
  width: 100%;
  margin: 0;
 }
 .top-loginarea {
  width: auto;
  margin: 0;
  padding: 10px 15px 0;
  background: #fff;
  border-radius: 0;
 }
 .top-loginarea .tit {
  padding: 0;
 }
 .top-loginarea .txt {
  margin-top: 0;
 }
 .top-loginarea .m-linkList {
  margin-top: 8px;
  font-size: 1.2rem;
 }
 .top-mainvisual-login [data-js="top-haveaccount-before"] {
  height: 125px;
 }
 .top-mainvisual-login [data-js="top-haveaccount-before"] .m-btnListS {
  margin-top: 6px;
 }
 .top-mainvisual-login [data-js="top-haveaccount-after"] {
  height: 110px;
 }
 .top-mainvisual-login [data-js="top-haveaccount-after"] .m-btnListS {
  margin-top: 6px;
 }
}
@media screen and (max-width: 559px) {
 .top-mainvisual-txt {
  margin: 45px 0 24px 0;
 }
 .top-mainvisual-cnt .top-picture-tit img {
  max-width: 290px;
 }
 .top-mainvisual-cnt .label {
  font-size: 1.3rem;
 }
 .top-mainvisual-cnt .tit {
  font-size: 2.5rem;
  line-height: 1.7;
 }
 .top-mainvisual-cnt .tit .tit-marker {
  padding: 0 2px 3px 5px;
 }
 .top-mainvisual-cnt .tit .tit-em {
  font-size: 3.5rem;
 }
 .top-mainvisual-cnt .tit .tit-br-pcHide {
  display: block;
 }
 .top-mainvisual-cnt .tit .tit-br-pcHide + .tit-marker {
  padding: 0 2px 3px 5px;
 }
 .top-mainvisual-cnt .txt {
  margin: 20px 0 0 13px;
  font-size: 1.3rem;
 }
 .top-mainvisual-cnt .btn > a {
  padding: 6px 35px 5px 23px;
 }
 .top-mainvisual-cnt .btn > a::before {
  right: 23px;
 }
 .top-loginarea {
  width: auto;
  margin: 0;
  padding: 10px 15px 0;
		border-radius: 0;
 }
 .top-loginarea .tit {
  padding: 0;
  font-size: 1.4rem;
 }
 .top-loginarea .txt {
  margin-top: 6px;
  font-size: 1.2rem;
 }
 .top-loginarea .m-btnListS > li {
  max-width: initial;
  padding: 0;
 }
 .top-loginarea .m-btnListS .m-btnDefR-s, .top-loginarea .m-btnListS .m-btnEm-s {
  padding-top: 5px;
  padding-bottom: 5px;
  max-width: initial;
 }
 .top-loginarea .m-linkList {
  margin-top: 8px;
  font-size: 1.2rem;
 }
 .top-mainvisual-login {
  margin: 49px 0 0;
 }
	.top-mainvisual-img {
  display: none;
 }
 .top-mainvisual-login [data-js="top-haveaccount-before"] {
  height: 125px;
 }
 .top-mainvisual-login [data-js="top-haveaccount-before"] .m-btnListS {
  margin-top: 6px;
 }
 .top-mainvisual-login [data-js="top-haveaccount-after"] {
  height: 110px;
 }
 .top-mainvisual-login [data-js="top-haveaccount-after"] .m-btnListS {
  margin-top: 10px;
 }
}
@media screen and (max-width: 460px) {
 .top-mainvisual {
  background: top right / 393px 220px url(/contents/cdn-img/top/static/bg_security_01_sp_02.png) no-repeat #ebeeff;
 }
 .top-mainvisual-link {
  left: inherit;
 }
}


.txt-security{
 width: 344px;
}
.btn-security{
 margin-top: 23px;
 width: 180px;
}
@media screen and (max-width: 1080px) {
 .txt-security{
  width: 294px;
 }
}
@media screen and (max-width: 819px) {
 .txt-security{
  width: 251px;
 }
 .btn-security{
  width: 150px;
 }
}
@media screen and (max-width: 659px) {
 .btn-security{
  margin-top: 14px;
 }
}
@media screen and (max-width: 559px) {
 .txt-security{
  width: 193px;
 }
 .btn-security{
  margin-left: 10px;
 }
}