@charset "UTF-8";
@import url("https://fonts.googleapis.com/css?family=Noto+Sans+JP:500,700&display=swap&subset=japanese");
#suntory_contents {
  font-family: 'Noto Sans JP',"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,sans-serif;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  font-weight: 500;
  color: #1a1a1a;
}

#suntory_contents main {
  display: block;
}

#suntory_contents a {
  color: #0066aa;
}

#suntory_contents * {
  margin: 0 auto;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

#suntory_contents .red {
  color: #e60000;
}

#suntory_contents a.btn {
  display: block;
  border-radius: 5px;
  -webkit-box-shadow: 4px 4px 0 -2px #ffffff, 4px 4px 0 0 #000000;
          box-shadow: 4px 4px 0 -2px #ffffff, 4px 4px 0 0 #000000;
  -webkit-transform: translateX(-2px);
          transform: translateX(-2px);
  overflow: hidden;
}

@media print, screen and (min-width: 768px) {
  #suntory_contents img {
    display: block;
  }
  #suntory_contents .hiddenPC {
    display: none !important;
  }
  #suntory_contents .fade {
    -webkit-transition: opacity 0.1s linear;
    transition: opacity 0.1s linear;
  }
  #suntory_contents .fade:hover {
    opacity: 0.7;
  }
  #suntory_contents a.btn:hover {
    -webkit-box-shadow: 6px 6px 0 -2px #ffffff, 6px 6px 0 0 #000000;
            box-shadow: 6px 6px 0 -2px #ffffff, 6px 6px 0 0 #000000;
    -webkit-transform: translateX(-4px) translateY(-2px);
            transform: translateX(-4px) translateY(-2px);
  }
  #suntory_contents a.btn:active {
    -webkit-box-shadow: none;
            box-shadow: none;
    -webkit-transform: translateX(2px) translateY(4px);
            transform: translateX(2px) translateY(4px);
  }
}

@media screen and (max-width: 767px) {
  #suntory_contents .hiddenSP {
    display: none !important;
  }
  #suntory_contents img {
    display: block;
    width: 100%;
  }
}

@media print, screen and (min-width: 768px) {
  #suntory_contents {
    background: #C0C0C0;
    min-width: 960px;
  }
  #suntory_contents .wrapper header {
    padding-bottom: 35px;
    width: 750px;
    background: #ffffff;
  }
  #suntory_contents .wrapper header h2 {
    margin-bottom: 20px;
  }
  #suntory_contents .wrapper main .program_wrapper {
    width: 750px;
    background: url(../img/datail-back1.png) center top/750px auto repeat-y, #000000;
  }
  #suntory_contents .wrapper main .mds_wrapper {
    margin-top: 60px;
    padding-top: 40px;
    padding-bottom: 40px;
    background: url(../img/bg_pc.png) center top/9px 9px repeat, #575757;
    color: #000000;
  }
  #suntory_contents .wrapper main section {
    width: 750px;
  }
  #suntory_contents .wrapper main section.detail {
    padding-top: 45px;
    padding-bottom: 35px;
    background: url(../img/datail-back1.png) center top/750px auto repeat-y, #000000;
  }
  #suntory_contents .wrapper main section.detail dl {
    width: 480px;
  }
  #suntory_contents .wrapper main section.detail dl dt {
    margin-bottom: 20px;
  }
  #suntory_contents .wrapper main section.detail dl dd {
    margin-bottom: 20px;
  }
  #suntory_contents .wrapper main section.detail dl dd:last-child {
    margin-bottom: 0;
  }
  #suntory_contents .wrapper main section.detail dl dd ul li, #suntory_contents .wrapper main section.detail dl dd p {
    font-size: 0.9375em;
    text-align: justify;
    line-height: 1.8;
    letter-spacing: 0.03em;
  }
  #suntory_contents .wrapper main section.detail dl dd ul.note li {
    padding-left: 1em;
    text-indent: -1em;
  }
  #suntory_contents .wrapper main section.detail dl dd p.cost {
    margin-bottom: 0.667em;
    color: #c80028;
    font-size: 1.875em;
    text-align: center;
    line-height: 1;
    letter-spacing: 0.21em;
    margin-top: 20px;
  }
  #suntory_contents .wrapper main section.program {
    padding-bottom: 25px;
  }
  #suntory_contents .wrapper main section.program h3 {
    margin-bottom: 17px;
  }
  #suntory_contents .wrapper main section.program .inner {
    background-image: url(../img/program-back__sp.png);
    background-size: 100% auto;
    background-repeat: no-repeat;
    padding-top: 30px;
    margin-left: 200px;
    margin-right: 200px;
  }
  #suntory_contents .wrapper main section.program .inner h4 {
    margin-top: 20px;
  }
  #suntory_contents .wrapper main section.program .inner p, #suntory_contents .wrapper main section.program .inner ul.note li {
    width: 315px;
    font-size: 0.9375em;
    text-align: justify;
    line-height: 1.8;
    letter-spacing: 0.03em;
  }
  #suntory_contents .wrapper main section.program .inner ul {
    position: relative;
    margin-top: 10px;
    padding: 0 15px;
  }
  #suntory_contents .wrapper main section.program .inner ul .menu {
    font-size: 0.9375em;
    line-height: 1.8;
    padding-top: 19px;
    letter-spacing: 0.03em;
  }
  #suntory_contents .wrapper main section.join {
    padding-top: 10px;
    padding-bottom: 55px;
  }
  #suntory_contents .wrapper main section.join .inner {
    padding: 25px 15px 30px;
    width: 480px;
    background: #ffffff;
    -webkit-box-shadow: 0 0 6px 0 rgba(88, 60, 50, 0.3);
            box-shadow: 0 0 6px 0 rgba(88, 60, 50, 0.3);
  }
  #suntory_contents .wrapper main section.join .inner h3 {
    margin-bottom: 10px;
    color: #c80028;
    font-size: 1.125em;
    font-weight: bold;
    line-height: 1.44;
    letter-spacing: 0.03em;
    text-align: center;
  }
  #suntory_contents .wrapper main section.join .inner h3 span {
    background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #F9FF00), color-stop(40%, #F9FF00), color-stop(40%, #ffffff), to(#ffffff));
    background: linear-gradient(to top, #F9FF00 0, #F9FF00 40%, #ffffff 40%, #ffffff 100%);
  }
  #suntory_contents .wrapper main section.join .inner ul.note li, #suntory_contents .wrapper main section.join .inner ul.extlink li {
    font-size: 0.8125em;
    font-weight: bold;
    line-height: 1.62;
    letter-spacing: 0.03em;
  }
  #suntory_contents .wrapper main section.join .inner ul.extlink li {
    padding-left: 1em;
    text-indent: -1em;
  }
  #suntory_contents .wrapper main section.join .inner ul.extlink .text {
    margin-bottom: 10px;
  }
  #suntory_contents .wrapper main section.join .inner ul.note {
    margin-bottom: 15px;
    text-align: center;
  }
  #suntory_contents .wrapper main section.join .inner a.join {
    margin-bottom: 15px;
    width: 311px;
    max-width: 311px;
  }
  #suntory_contents .wrapper main section.join .inner p.term {
    margin-bottom: 5px;
    font-size: 0.9375em;
    font-weight: bold;
    line-height: 1.6;
    letter-spacing: 0.03em;
    text-align: center;
  }
  #suntory_contents .wrapper main section.join .inner ul.extlink {
    margin-bottom: 20px;
    padding: 0 70px;
  }
  #suntory_contents .wrapper main section.join .inner a.login {
    width: 261px;
    max-width: 261px;
  }
  #suntory_contents .wrapper main section.whatis_mds {
    padding-top: 60px;
    width: 750px;
    background: #ffffff;
  }
  #suntory_contents .wrapper main section.whatis_mds h3 {
    margin-bottom: 25px;
  }
  #suntory_contents .wrapper main section.whatis_mds .text {
    margin-bottom: 40px;
  }
  #suntory_contents .wrapper main section.whatis_mds hr {
    width: 420px;
    border: none;
    border-bottom: 1px dotted #aeaeae;
  }
  #suntory_contents .wrapper main section.benefit {
    padding-top: 35px;
    padding-bottom: 45px;
    width: 750px;
    background: #ffffff;
  }
  #suntory_contents .wrapper main section.benefit h3 {
    margin-bottom: 30px;
  }
  #suntory_contents .wrapper main section.benefit dl {
    width: 460px;
  }
  #suntory_contents .wrapper main section.benefit dl dd {
    margin-bottom: 15px;
    padding: 23px 40px 25px;
    border: 1px solid #aeaeae;
    border-top: none;
  }
  #suntory_contents .wrapper main section.benefit dl dd:last-of-type {
    margin-bottom: 0;
  }
  #suntory_contents .wrapper main section.benefit dl dd .visual {
    margin-bottom: 15px;
  }
  #suntory_contents .wrapper main section.benefit dl dd .visual ul.note {
    margin-top: 15px;
  }
  #suntory_contents .wrapper main section.benefit dl dd .visual ul.note li {
    font-size: 0.8125em;
    text-align: center;
    letter-spacing: 0.03em;
    line-height: 1.6;
  }
  #suntory_contents .wrapper main section.benefit dl dd p {
    font-size: 0.9375em;
    text-align: justify;
    line-height: 1.4;
    letter-spacing: 0.03em;
  }
  #suntory_contents .wrapper main section.entry_mds {
    padding: 0 4vw 35px;
    width: 750px;
    background: #ffffff;
  }
  #suntory_contents .wrapper main section.entry_mds a.join {
    margin-bottom: 15px;
    width: 311px;
    max-width: 311px;
  }
  #suntory_contents .wrapper main section.entry_mds ul.extlink {
    padding: 0 180px;
  }
  #suntory_contents .wrapper main section.entry_mds ul.extlink li {
    font-size: 0.8125em;
    letter-spacing: 0.03em;
    line-height: 1.6;
    padding-left: 1em;
    text-indent: -1em;
  }
  #suntory_contents .wrapper main section.entry_mds ul.extlink .text {
    margin-bottom: 10px;
  }
  #suntory_contents .wrapper footer.contact {
    padding-top: 40px;
    padding-bottom: 40px;
    background: #f0f0f0;
  }
  #suntory_contents .wrapper footer.contact .inner {
    padding: 30px 100px 35px;
    width: 750px;
    background: #ffffff;
  }
  #suntory_contents .wrapper footer.contact .inner h3, #suntory_contents .wrapper footer.contact .inner p, #suntory_contents .wrapper footer.contact .inner ul.note li {
    font-size: 0.9375em;
    text-align: justify;
    line-height: 1.8;
    letter-spacing: 0.03em;
  }
  #suntory_contents .wrapper footer.contact .inner h3 {
    text-align: center;
  }
  #suntory_contents .wrapper footer.contact .inner hr {
    margin-top: 18px;
    margin-bottom: 18px;
    border: none;
    border-bottom: 1px dotted #aeaeae;
  }
  #suntory_contents .wrapper footer.contact .inner ul.note {
    margin-bottom: 0.5em;
  }
  #suntory_contents .wrapper footer.contact .inner ul.note li {
    padding-left: 1em;
    text-indent: -1em;
  }
}

@media screen and (max-width: 767px) {
  #suntory_contents .wrapper header {
    padding-bottom: 25px;
    background: #ffffff;
  }
  #suntory_contents .wrapper header h2 {
    margin-bottom: 40px;
  }
  #suntory_contents .wrapper header h3 {
    margin-top: 15px;
    margin-left: 15px;
    margin-right: 15px;
  }
  #suntory_contents .wrapper main .program_wrapper {
    background: url(../img/datail-back1.png) center top/750px auto repeat-y, #000000;
  }
  #suntory_contents .wrapper main .mds_wrapper {
    padding-top: 30px;
    padding-bottom: 30px;
    background: url(../img/bg_pc.png) center top/9px 9px repeat, #575757;
    color: #000000;
  }
  #suntory_contents .wrapper main section.detail {
    padding-top: 36px;
    padding-bottom: 37px;
    background: url(../img/datail-back1.png) center top/750px auto repeat-y, #000000;
  }
  #suntory_contents .wrapper main section.detail dl {
    width: 84vw;
  }
  #suntory_contents .wrapper main section.detail dl dd {
    margin-bottom: 15px;
    margin-top: 15px;
  }
  #suntory_contents .wrapper main section.detail dl dd:last-child {
    margin-bottom: 0;
  }
  #suntory_contents .wrapper main section.detail dl dd ul li, #suntory_contents .wrapper main section.detail dl dd p {
    font-size: 0.9375em;
    text-align: justify;
    line-height: 1.8;
    letter-spacing: 0.03em;
  }
  #suntory_contents .wrapper main section.detail dl dd ul.check {
    margin-bottom: 10px;
  }
  #suntory_contents .wrapper main section.detail dl dd ul.check li {
    position: relative;
    margin-bottom: 0.667em;
    padding-left: 2em;
    color: #00155e;
    line-height: 1.6;
  }
  #suntory_contents .wrapper main section.detail dl dd ul.check li:last-child {
    margin-bottom: 0;
  }
  #suntory_contents .wrapper main section.detail dl dd ul.check li:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    display: block;
    width: 2em;
    height: 1.8em;
    background: url(../img/icn_check.svg) left center/18px auto no-repeat;
  }
  #suntory_contents .wrapper main section.detail dl dd ul.note li {
    padding-left: 1em;
    text-indent: -1em;
  }
  #suntory_contents .wrapper main section.detail dl dd p.cost {
    padding-top: 7px;
    margin-bottom: 21px;
    color: #c80028;
    font-size: 1.875em;
    text-align: center;
    line-height: 0.9;
    letter-spacing: 0.21em;
    font-weight: bold;
  }
  #suntory_contents .wrapper main section.program h3 {
    margin-bottom: 17px;
  }
  #suntory_contents .wrapper main section.program .inner {
    background-image: url(../img/program-back__sp.png);
    background-size: 100% auto;
    background-repeat: no-repeat;
    padding-top: 20px;
    margin-left: 15px;
    margin-right: 15px;
  }
  #suntory_contents .wrapper main section.program .inner p, #suntory_contents .wrapper main section.program .inner ul.note li {
    width: 84vw;
    font-size: 0.9375em;
    text-align: justify;
    line-height: 1.8;
    letter-spacing: 0.03em;
  }
  #suntory_contents .wrapper main section.program .inner ul {
    position: relative;
    margin-top: 21px;
    padding: 0 15px;
  }
  #suntory_contents .wrapper main section.program .inner ul .menu {
    font-size: 0.9375em;
    line-height: 1.8;
    padding-top: 17px;
    letter-spacing: 0.03em;
  }
  #suntory_contents .wrapper main section.join {
    padding-top: 26px;
    padding-bottom: 30px;
  }
  #suntory_contents .wrapper main section.join .inner {
    padding: 25px 4vw 30px;
    width: 92vw;
    background: #ffffff;
    -webkit-box-shadow: 0 0 6px 0 rgba(88, 60, 50, 0.3);
            box-shadow: 0 0 6px 0 rgba(88, 60, 50, 0.3);
  }
  #suntory_contents .wrapper main section.join .inner h3 {
    margin-bottom: 10px;
    color: #c80028;
    font-size: 1.125em;
    font-weight: bold;
    line-height: 1.44;
    letter-spacing: 0.03em;
    text-align: center;
  }
  #suntory_contents .wrapper main section.join .inner h3 span {
    background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #F9FF00), color-stop(40%, #F9FF00), color-stop(40%, #ffffff), to(#ffffff));
    background: linear-gradient(to top, #F9FF00 0, #F9FF00 40%, #ffffff 40%, #ffffff 100%);
  }
  #suntory_contents .wrapper main section.join .inner ul.note li, #suntory_contents .wrapper main section.join .inner ul.extlink li {
    font-size: 0.8125em;
    font-weight: bold;
    line-height: 1.62;
    letter-spacing: 0.03em;
  }
  #suntory_contents .wrapper main section.join .inner ul.extlink li {
    padding-left: 1em;
    text-indent: -1em;
  }
  #suntory_contents .wrapper main section.join .inner ul.extlink .text {
    margin-bottom: 10px;
  }
  #suntory_contents .wrapper main section.join .inner ul.note {
    margin-bottom: 15px;
    text-align: center;
  }
  #suntory_contents .wrapper main section.join .inner a.join {
    margin-bottom: 15px;
    width: 311px;
    max-width: 82.93333vw;
  }
  #suntory_contents .wrapper main section.join .inner p.term {
    margin-bottom: 5px;
    font-size: 0.9375em;
    font-weight: bold;
    line-height: 1.6;
    letter-spacing: 0.03em;
    text-align: center;
  }
  #suntory_contents .wrapper main section.join .inner ul.extlink {
    margin-bottom: 20px;
  }
  #suntory_contents .wrapper main section.join .inner a.login {
    width: 261px;
    max-width: 69.6vw;
  }
  #suntory_contents .wrapper main section.whatis_mds {
    padding: 55px 4vw 0;
    width: 92vw;
    background: #ffffff;
  }
  #suntory_contents .wrapper main section.whatis_mds h3 {
    margin-bottom: 26px;
    width: 60.8vw;
    max-width: 100%;
  }
  #suntory_contents .wrapper main section.whatis_mds .text {
    margin-bottom: 50px;
    width: 65.6vw;
    max-width: 100%;
  }
  #suntory_contents .wrapper main section.whatis_mds hr {
    width: 100%;
    border: none;
    border-bottom: 1px dotted #aeaeae;
  }
  #suntory_contents .wrapper main section.benefit {
    padding: 30px 4vw 25px;
    width: 92vw;
    background: #ffffff;
  }
  #suntory_contents .wrapper main section.benefit h3 {
    margin-bottom: 24px;
    width: 34.93333vw;
    max-width: 100%;
  }
  #suntory_contents .wrapper main section.benefit dl {
    width: 100%;
  }
  #suntory_contents .wrapper main section.benefit dl dt {
    width: 100%;
  }
  #suntory_contents .wrapper main section.benefit dl dd {
    margin-bottom: 15px;
    padding: 20px 14px 25px;
    border: 1px solid #aeaeae;
    border-top: none;
  }
  #suntory_contents .wrapper main section.benefit dl dd:last-of-type {
    margin-bottom: 0;
  }
  #suntory_contents .wrapper main section.benefit dl dd:nth-of-type(3) {
    padding-top: 40px;
  }
  #suntory_contents .wrapper main section.benefit dl dd:nth-of-type(3) .visual {
    margin-bottom: 25px;
    width: 253.5px;
    max-width: 100%;
  }
  #suntory_contents .wrapper main section.benefit dl dd .visual {
    margin-bottom: 15px;
  }
  #suntory_contents .wrapper main section.benefit dl dd .visual ul.note {
    margin-top: 10px;
  }
  #suntory_contents .wrapper main section.benefit dl dd .visual ul.note li {
    font-size: 0.8125em;
    text-align: center;
    letter-spacing: 0.03em;
    line-height: 1.6;
  }
  #suntory_contents .wrapper main section.benefit dl dd p {
    font-size: 0.9375em;
    text-align: justify;
    line-height: 1.5;
    letter-spacing: 0.03em;
  }
  #suntory_contents .wrapper main section.entry_mds {
    padding: 0 4vw 35px;
    width: 92vw;
    background: #ffffff;
  }
  #suntory_contents .wrapper main section.entry_mds a.join {
    margin-bottom: 15px;
    width: 311px;
    max-width: 82.93333vw;
  }
  #suntory_contents .wrapper main section.entry_mds ul.extlink li {
    font-size: 0.8125em;
    letter-spacing: 0.03em;
    line-height: 1.6;
    padding-left: 1em;
    text-indent: -1em;
  }
  #suntory_contents .wrapper main section.entry_mds ul.extlink .text {
    margin-bottom: 10px;
  }
  #suntory_contents .wrapper footer.contact {
    padding-top: 30px;
    padding-bottom: 30px;
    background: #f0f0f0;
  }
  #suntory_contents .wrapper footer.contact .inner {
    padding: 25px 4vw;
    width: 92vw;
    background: #ffffff;
  }
  #suntory_contents .wrapper footer.contact .inner h3, #suntory_contents .wrapper footer.contact .inner h4, #suntory_contents .wrapper footer.contact .inner p, #suntory_contents .wrapper footer.contact .inner ul.note li {
    font-size: 0.9375em;
    text-align: justify;
    line-height: 1.8;
    letter-spacing: 0.03em;
  }
  #suntory_contents .wrapper footer.contact .inner h3 {
    text-align: center;
  }
  #suntory_contents .wrapper footer.contact .inner hr {
    margin-top: 10px;
    margin-bottom: 10px;
    border: none;
    border-bottom: 1px dotted #aeaeae;
  }
  #suntory_contents .wrapper footer.contact .inner p {
    margin-bottom: 2px;
  }
  #suntory_contents .wrapper footer.contact .inner ul.note li {
    padding-left: 1em;
    text-indent: -1em;
  }
}