@charset "utf-8";
/* =kv
----------------------------------*/
.dinersclubapp-kv-area {
  position: relative;
  margin: 0 auto;
}
.dinersclubapp-kv {
  height: 0;
  padding-top: 65%;
  background: url(/content/dam/diners/img/premium/member/card/dinersclubapp/dinersclubapp_kv.jpg) 0 0 no-repeat;
  background-size: contain;
}
.dinersclubapp-iphone {
  text-align: center;
  top: 12%;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  position: absolute;
}
.dinersclubapp-iphone img {
  width: 52%;
}

@media screen and (min-width: 768px) {
.dinersclubapp-kv {
  padding-top: 51.5%;
}
.dinersclubapp-iphone img {
  width: 42%;
}
}
/* =
----------------------------------*/
.cf:after {
  content: "";
  display: block;
  clear: both;
}

.dinersclubapp-sp-none {
  display: none;
}

.dinersclubapp-container {
  padding: 0 20px 30px 20px;
}
.dinersclubapp-h3 {
  padding-top: 15px;
  font-size: 2.4rem;
}
.dinersclubapp-sub-ttl {
  padding-top: 5px;
  font-size: 1.3rem;
  font-family: 'Roboto', sans-serif;
  letter-spacing: 0.1em;
  margin-bottom: 10px;
  font-weight: 900;
}
.dinersclubapp-catch {
  padding-top: 5px;
  font-size: 2.0rem;
  font-family: 'Roboto', sans-serif;
  letter-spacing: 0.1em;
  margin-bottom: 10px;
  font-weight: 400;
  text-align: center;
}
.dinersclubapp-block {
  padding: 50px 20px 50px 20px;
  border-bottom: 2px solid #263032;
  text-align: center;
}
.dinersclubapp-att {
  padding-top: 5px;
  font-size: 1.3rem;
}

.dinersclubapp-irg {
  padding-top: 15px;
}

.dinersclubapp-coupon-example li {
  padding-top: 5px;
  text-align: left;
}

.dinersclubapp-coupon-example span {
  padding-right: 1em;
}

.dinersclubapp-indent-4 {
  text-indent: -4em;
  padding-left: 4em;
}
.dinersclubapp-indent-5 {
  text-indent: -5em;
  padding-left: 5em;
}
.dinersclubapp-coupon-block {
  padding: 50px 20px 50px 20px;
  text-align: center;
}

.dinersclubapp-row {
  display: flex;
  margin-left: -20px;
}


.btn-apple {
  width: 130px;
}
.btn-google {
  width: 160px;
}
.dinersclubapp-btn {
  display: flex;
  justify-content: center;
  margin: 30px auto 0 auto;
  flex-wrap: wrap;
}
.dinersclubapp-btn > li {
  width: calc(50% - 20px);
  margin: 0 0 0 20px;
}

.dinersclubapp-app-ico {
  text-align: center;
  padding-top: 30px;
    padding-bottom: 10px;
}

.dinersclubapp-app-ico img {
  width: 30%;
}

@media screen and (min-width: 768px) {
.dinersclubapp-pc-none {
  display: none;
}
.dinersclubapp-sp-none {
  display: inherit;
}
.qr-app {
  width: 100px;
}

.dinersclubapp-btn-pc {
  display: flex;
  justify-content: center;
  margin: 30px auto 0 auto;
  flex-wrap: wrap;
}
.dinersclubapp-btn-pc > li {
  margin: 0 0 0 20px;
}

.dinersclubapp-container {
  max-width: 1240px;
  margin: 0 auto;
  padding: 0 30px;
}
.dinersclubapp-row-block {
  display: flex;
  margin-left: -100px;
}
.dinersclubapp-col {
  width: 100%;
  margin-left: 100px;
}

.dinersclubapp-btn {
  margin: 30px auto;
}

.dinersclubapp-coupon-block {
  padding: 50px 20px 50px 20px;
  text-align: center;
  margin-top: 30px;
      width: 100%;
}

.dinersclubapp-coupon-inner {
  display: inline-block;
}

.dinersclubapp-coupon-left {
  float: left;
  margin-right: 70px;
}

.dinersclubapp-coupon-right {
  float: left;
  text-align: left;
}

/* =�����𑵂��� */
.arrange-height {
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: wrap; /* Safari */
  flex-wrap: wrap;
}

.dinersclubapp-block {
  padding: 70px 50px 30px 50px;
  border-bottom: 2px solid #263032;
  text-align: left;
}
.dinersclubapp-app-ico img {
  width: 10%;
}
.dinersclubapp-app-ico {
  padding-top: 50px;
}
.coupon-block {
  padding: 70px 50px 30px 50px;
  text-align: left;
}
}


/* =benefit
----------------------------------*/
.dinersclubapp-benefit-area {
  position: relative;
  margin: 0 auto;
}

.dinersclubapp-benefit {
  height: 0;
  padding-top: 135%;
  background: url(/content/dam/diners/img/premium/member/card/dinersclubapp/benefit_bg.jpg) center bottom no-repeat;
  background-size: cover;
}

.dinersclubapp-benefit-text {
  text-align: center;
  top: 20px;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  position: absolute;
  padding-left: 20px;
  padding-right: 20px;
}
.dinersclubapp-benefit-ico img {
  width: 15%;
}

.dinersclubapp-airport-ico img {
  width: 18%;
}

.dinersclubapp-coupon-ico img {
  width: 18%;
}

.dinersclubapp-col-ico img {
  width: 13%;
}

@media screen and (min-width: 768px) {
.dinersclubapp-benefit {
  height: 400px;
  background: url(/content/dam/diners/img/premium/member/card/dinersclubapp/benefit_bg_pc.jpg) 0 0 no-repeat;
  background-size: cover;
  padding-top: 0;
}
.dinersclubapp-benefit-ico img {
  width: 58px;
}
.dinersclubapp-benefit-text {
  text-align: center;
  top: 100px;
  right: 0;
  bottom: 0;
  left: 50%;
  margin: auto;
  position: absolute;
  padding-left: 20px;
  padding-right: 20px;
  width: 430px;
}
.dinersclubapp-col-ico img {
  width: 13%;
}
.dinersclubapp-coupon-ico img {
  width: 40%;
}
}



/* =coupon
----------------------------------*/
.dinersclubapp-coupon-area {
  position: relative;
  margin: 0 auto;
}
.dinersclubapp-coupon {
  height: 0;
  padding-top: 115%;
  background: url(/content/dam/diners/img/premium/member/card/dinersclubapp/coupon_bg.jpg) center bottom no-repeat;
  background-size: cover;
}
.dinersclubapp-coupon-text {
  text-align: center;
  top: 20px;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  position: absolute;
  padding-left: 20px;
  padding-right: 20px;
}

@media screen and (min-width: 768px) {
.dinersclubapp-coupon {
  height: 350px;
  background: url(/content/dam/diners/img/premium/member/card/dinersclubapp/coupon_bg_pc.jpg) 0 bottom no-repeat;
  background-size: cover;
  padding-top: 0;
  margin-top: 40px;
}
.dinersclubapp-coupon-ico img {
  width: 52px;
}
.dinersclubapp-coupon-text {
  text-align: center;
  top: 80px;
  right: 50%;
  bottom: 0;
  left: 0;
  margin: auto;
  position: absolute;
  padding-left: 20px;
  padding-right: 20px;
  width: 430px;
}
}



/* =signature
----------------------------------*/
.dinersclubapp-signature-area {
  position: relative;
  margin: 0 auto;
}
.dinersclubapp-signature {
  height: 0;
  padding-top: 115%;
  background: url(/content/dam/diners/img/premium/member/card/dinersclubapp/signature_bg.jpg) center bottom no-repeat;
  background-size: cover;
}
.dinersclubapp-signature-text {
  text-align: center;
  top: 20px;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  position: absolute;
  padding-left: 20px;
  padding-right: 20px;
  color: #fff;
}

@media screen and (min-width: 768px) {
.dinersclubapp-signature {
  height: 400px;
  background: url(/content/dam/diners/img/premium/member/card/dinersclubapp/signature_bg_pc.jpg) 0 0 no-repeat;
  background-size: cover;
  padding-top: 0;
  margin-top: 40px;
}
.dinersclubapp-signature-ico img {
  width: 52px;
}
.dinersclubapp-signature-text {
  text-align: center;
  top: 120px;
  right: 0;
  bottom: 0;
  left: 50%;
  margin: auto;
  position: absolute;
  padding-left: 20px;
  padding-right: 20px;
  width: 430px;
}
}


/* =premium
----------------------------------*/

.dinersclubapp-premium-area {
  position: relative;
  margin: 0 auto;
}

.dinersclubapp-premium {
  height: 0;
  padding-top: 155%;
  background: url(/content/dam/diners/img/premium/member/card/dinersclubapp/premium_coupon_bg.jpg) center bottom no-repeat;
  background-size: cover;
}

.dinersclubapp-premium-text {
  text-align: center;
  top: 15px;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  position: absolute;
  padding-left: 20px;
  padding-right: 20px;
}

.dinersclubapp-p-coupon-example li {
  padding-bottom: 5px;
  text-align: left;
}

.dinersclubapp-premium-ico img {
  width: 15%;
}

.dinersclubapp-airport-ico img {
  width: 18%;
}

.dinersclubapp-coupon-ico img {
  width: 18%;
}

.dinersclubapp-col-ico img {
  width: 13%;
}

.dinersclubapp-p-container {
  padding: 0 20px;
}

.dinersclubapp-p-guide-block {
  padding-top: 40px;
  text-align: left;
}

.dinersclubapp-p-guide-content {
  padding: 3rem;
}

.dinersclubapp-p-coupon-example {
  padding: 5px 0px 0px 60px;
}

.dinersclubapp-col-p-ico img {
  width: 17%;
}

@media screen and (min-width: 768px) {

.dinersclubapp-premium {
  height: 400px;
  background: url(/content/dam/diners/img/premium/member/card/dinersclubapp/premium_coupon_bg_pc.jpg) 0 0 no-repeat;
  background-size: cover;
  padding-top: 0;
}

.dinersclubapp-premium-text {
  text-align: center;
  top: 35px;
  right: 0;
  bottom: 0;
  left: 50%;
  margin: auto;
  position: absolute;
  padding-left: 20px;
  padding-right: 20px;
  width: 430px;
}

.dinersclubapp-col-premium-ico img {
  width: 15%;
}

.dinersclubapp-col-p-ico img {
  width: 17%;
}

.dinersclubapp-coupon-ico img {
  width: 40%;
}

.dinersclubapp-p-container {
    max-width: 1240px;
    margin: 0 auto;
    padding: 0 30px;
}

.dinersclubapp-p-guide-block {
  padding: 20px 0px 40px 0px;
  text-align: left;
}

.dinersclubapp-p-guide-content {
  padding: 15px 30px;
}

.dinersclubapp-p-coupon-example {
  padding: 10px 0px 0px 75px;
}

.dinersclubapp-coupon-right {
    float: inherit;
    text-align: center;
}

.dinersclubapp-col-right {
  width: 100%;
  margin-left: 20px;
}
}