@charset "UTF-8";
/*=========
 もくじ
 ・normalize.css
 ・プラグインで使用するCSS
 ・base - タグの初期設定
 ・common parts - 共通パーツ（ボタンなど）
 ・ヘッダー、フッター
 ・各ページごとの設定
 =========*/

/*! normalize.css v4.1.1 | MIT License | github.com/necolas/normalize.css */
/**
 * 1. Change the default font family in all browsers (opinionated).
 * 2. Prevent adjustments of font size after orientation changes in IE and iOS.
 */
html {
  font-family: sans-serif; /* 1 */
  -ms-text-size-adjust: 100%; /* 2 */
  -webkit-text-size-adjust: 100%; /* 2 */
}
/**
 * Remove the margin in all browsers (opinionated).
 */
body {
  margin: 0;
}
/* HTML5 display definitions
   ========================================================================== */
/**
 * Add the correct display in IE 9-.
 * 1. Add the correct display in Edge, IE, and Firefox.
 * 2. Add the correct display in IE.
 */
article,
aside,
details, /* 1 */
figcaption,
figure,
footer,
header,
main, /* 2 */
menu,
nav,
section,
summary { /* 1 */
  display: block;
}
/**
 * Add the correct display in IE 9-.
 */
audio,
canvas,
progress,
video {
  display: inline-block;
}
/**
 * Add the correct display in iOS 4-7.
 */
audio:not([controls]) {
  display: none;
  height: 0;
}
/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
  vertical-align: baseline;
}
/**
 * Add the correct display in IE 10-.
 * 1. Add the correct display in IE.
 */
template, /* 1 */
[hidden] {
  display: none;
}
/* Links
   ========================================================================== */
/**
 * 1. Remove the gray background on active links in IE 10.
 * 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
 */
a {
  background-color: transparent; /* 1 */
  -webkit-text-decoration-skip: objects; /* 2 */
}
/**
 * Remove the outline on focused links when they are also active or hovered
 * in all browsers (opinionated).
 */
a:active,
a:hover {
  outline-width: 0;
}
/* Text-level semantics
   ========================================================================== */
/**
 * 1. Remove the bottom border in Firefox 39-.
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
  border-bottom: none; /* 1 */
  text-decoration: underline; /* 2 */
  text-decoration: underline dotted; /* 2 */
}
/**
 * Prevent the duplicate application of `bolder` by the next rule in Safari 6.
 */
b,
strong {
  font-weight: inherit;
}
/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
  font-weight: bolder;
}
/**
 * Add the correct font style in Android 4.3-.
 */
dfn {
  font-style: italic;
}
/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}
/**
 * Add the correct background and color in IE 9-.
 */
mark {
  background-color: #ff0;
  color: #000;
}
/**
 * Add the correct font size in all browsers.
 */
small {
  font-size: 80%;
}
/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sub {
  bottom: -0.25em;
}
sup {
  top: -0.5em;
}
/* Embedded content
   ========================================================================== */
/**
 * Remove the border on images inside links in IE 10-.
 */
img {
  border-style: none;
}
/**
 * Hide the overflow in IE.
 */
svg:not(:root) {
  overflow: hidden;
}
/* Grouping content
   ========================================================================== */
/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
pre,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}
/**
 * Add the correct margin in IE 8.
 */
figure {
  margin: 1em 40px;
}
/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
  box-sizing: content-box; /* 1 */
  height: 0; /* 1 */
  overflow: visible; /* 2 */
}
/* Forms
   ========================================================================== */
/**
 * 1. Change font properties to `inherit` in all browsers (opinionated).
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
select,
textarea {
  font: inherit; /* 1 */
  margin: 0; /* 2 */
}
/**
 * Restore the font weight unset by the previous rule.
 */
optgroup {
  font-weight: bold;
}
/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input { /* 1 */
  overflow: visible;
}
/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select { /* 1 */
  text-transform: none;
}
/**
 * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
 *    controls in Android 4.
 * 2. Correct the inability to style clickable types in iOS and Safari.
 */
button,
html [type="button"], /* 1 */
[type="reset"],
[type="submit"] {
  -webkit-appearance: button; /* 2 */
}
/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}
/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}
/**
 * Change the border, margin, and padding in all browsers (opinionated).
 */
fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}
/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */
legend {
  box-sizing: border-box; /* 1 */
  color: inherit; /* 2 */
  display: table; /* 1 */
  max-width: 100%; /* 1 */
  padding: 0; /* 3 */
  white-space: normal; /* 1 */
}
/**
 * Remove the default vertical scrollbar in IE.
 */
textarea {
  overflow: auto;
}
/**
 * 1. Add the correct box sizing in IE 10-.
 * 2. Remove the padding in IE 10-.
 */
[type="checkbox"],
[type="radio"] {
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
}
/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}
/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type="search"] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}
/**
 * Remove the inner padding and cancel buttons in Chrome and Safari on OS X.
 */
[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}
/**
 * Correct the text style of placeholders in Chrome, Edge, and Safari.
 */
::-webkit-input-placeholder {
  color: inherit;
  opacity: 0.54;
}
/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}



/*=========
 base
=========*/
*{
    box-sizing:border-box;
}
html{
	font-size:94%;
  scroll-behavior: smooth;
}
.nosmoothscroll{ /* 一時的に止める */
  scroll-behavior: auto;
}


@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 100;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 200;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 300;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 400;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Bold");
  font-weight: bold;
}
@font-face {
  font-family: "Helvetica Neue";
  src: local("Helvetica Neue Regular");
  font-weight: 100;
}
@font-face {
  font-family: "Helvetica Neue";
  src: local("Helvetica Neue Regular");
  font-weight: 200;
}
body {
  font-family: "-apple-system", "Helvetica Neue","ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "Yu Gothic", YuGothic, Verdana, Meiryo, "M+ 1p", sans-serif;
  font-weight:normal;
  background:#fff;
  color:#000;
  line-height:1.4;
}
a{
	color:#06f;
  overflow-wrap: break-word;
}
img{
    max-width:100%;
    max-height:100%;
    width:auto;
    height:auto;
    vertical-align:bottom;
}
svg{
    max-width:100%;
    max-height:100%;
    vertical-align:bottom;
}
img[src$=".svg"], svg {
    width: 100%;
}
input, select{
    max-width:100%;
    font-size:1.07rem;
}
button:hover{
  cursor: pointer;
}
em, em a, em a{
	font-weight:bold;
	font-style:normal;
	color:#f01586;
}
strong{
	color:#f00;
}
h3{
	margin-bottom:0.5em;
	color:#eb6da5;
}
h4{
	margin:1.5em 0 0.8em;
	font-size:105%;
}
ul{
    list-style-image:url(../img/common/circle.svg);
    padding-left:20px;
}
nav > ul, nav > ul > li{
    list-style:none;
    margin:0;
    padding:0;
}
li{
    margin:0.5em 0;
}
ol{
  counter-reset:number;
  list-style:none;
  padding-left:2em;
}
ol > li:before{
  counter-increment: number;
  content: counter(number);
  display:inline-flex;
  align-items: center;
  justify-content: center;
  width:1.5em;
  height:1.5em;
  margin:0 0.25em 0 -1.5em;
  background:#eb6da5;
  color:#fff;
  border-radius:50%;
  font-size:0.9em;
  font-family: 'Roboto', sans-serif;
  font-weight:bold;
  text-align:center;
  line-height:1;
  vertical-align:middle;
}
ol figure{
    margin-left:calc(-2em - 5px);
}
figure > img{
    display:block;
    margin:0 auto;
}
figcaption{
    margin-top:5px;
    text-align:center;
}
table{
    border-collapse:collapse;
    border:solid 1px #bbb;
    width:100%;
    margin:1.5em 0;
}
caption{
    background:#eb6da5;
    color:#fff;
    text-align:left;
    padding:10px;
    padding-left:calc(1.3em + 10px);
    text-indent:-1.3em;
}
caption:before{
    content:"●";
    margin-right:0.3em;
}
section:after{
    content:"";
    display:table;
    clear:both;
}
th{
    background:#eee;
    padding:10px;
    text-align:left;
    font-weight:normal;
    border:solid 1px #bbb;
    margin:-1px;
    white-space:nowrap;
    vertical-align:top;
}
td{
    padding:10px;
    border:solid 1px #bbb;
    margin:-1px;
    vertical-align:top;
}
td > :first-child{
    margin-top:0;
}
td > :last-child{
    margin-bottom:0;
}
dl{
    margin:1em 0;
}
dt{
    margin:0.75em 0 0.25em;
}
dd{
    margin:0;
}
input,  textarea{
    max-width:100%;
}
textarea{
    height:10em;
}


/*=========
 ヘッダー
=========*/
.hdr{
  background: #f01586;
  position: fixed;
  margin: 0;
  top: 0;
  left: 0;
  right: 0;
  z-index: 100;
}
.hdr__inner{
  display: flex;
  justify-content: space-between;
  padding: 11px 15px 6px;
}
.hdr__logo{
  margin: 0;
  line-height: 1;
  font-size: 1.2em;
}
.hdr__logo > a{
  display: block;
}
.hdr__logo__logo{
  height: 1em;
  width: auto !important;
  vertical-align: middle;
  margin-right: 9px;
}
.hdr__logo__badge{
  height: 1.6em;
  width: auto !important;
  vertical-align: middle;
}
.hdr__read{
  display: none;
}

@media screen and (min-width: 768px) {
  .hdr{
    position:relative;
  }
  .hdr__inner{
    max-width:1024px;
    margin: 0 auto;
    padding: 3vw 15px 1vw;
  }
  .hdr__logo{
    font-size: 2.2em;
    font-size: 3.2vw;
  }
  .hdr__logo__logo{
    margin-right: 16px;
  }
  .hdr__logo__badge{
    height: 1.8em;
  }
  .hdr__read{
    display: block;
    margin: 0 20px 0 0;
    font-size: 1.5rem;
    font-weight: bold;
    line-height: 1.2;
    margin-top: 2vw;
  }
  .hdr__read > a{
    color: #fff;
    text-decoration: none;
  }
}

@media screen and (min-width: 1054px) {
  .hdr__inner{
    padding: 34px 0 10px;
  }
  .hdr__logo{
    font-size: 2.5em;
  }
  .hdr__logo__logo{
    margin-right: 18px;
  }
  .hdr__logo__badge{
    height: 1.6em;
  }
  .hdr__read{
    font-size: 1.8rem;
    margin: 19px 0 0;
  }
}



/*=========
 official accounts
=========*/
.accounts{
    margin:30px auto;
    max-width:350px;
}
.accounts__btn{
    display:-webkit-flex;
    display:flex;
    -webkit-align-items:center;
    align-items:center;
    margin:4px 0;
    padding:12px 5px 12px 15px;
    background:#369;
    color:#fff;
    border-radius:8px;
    font-weight:bold;
    text-decoration:none;
    font-size:4.5vw;
    white-space:nowrap;
}
.accounts__btn:hover{
    background:#4f7fb0;
}
.accounts__btn:before{
    content:"";
    display:inline-block;
    -webkit-flex:0 0 1.75em;
    flex:0 0 1.75em;
    width:1.75em;
    height:1.75em;
    margin-right:0.75em;
    vertical-align:middle;
    background-position:50% 50%;
    background-size:contain;
    background-repeat:no-repeat;
}
.accounts__btn--fb{
    background:#2a5b9f;
}
.accounts__btn--fb:hover{
    background:#406fb1;
}
.accounts__btn--fb:before{
    background-image:url(../img/common/ico_social_fb.svg);
}
.ie .accounts__btn--fb:before{
    background-image:url(../img/common/ico_social_fb.png);
}
.accounts__btn--tw{
    background:#2fa6de;
}
.accounts__btn--tw:hover{
    background:#4bbbef;
}
.accounts__btn--tw:before{
    background-image:url(../img/common/ico_social_tw.svg);
}
.ie .accounts__btn--tw:before{
    background-image:url(../img/common/ico_social_tw.png);
}
.accounts__btn--yt{
    background:#c00;
}
.accounts__btn--yt:hover{
    background:#de1e1e;
}
.accounts__btn--yt:before{
    background-image:url(../img/common/ico_social_yt.svg);
}
.accounts__btn--line{
    background:#00c300;
}
.accounts__btn--line:hover{
    background:#4dd54d;
}
.accounts__btn--line:before{
    background-image:url(../img/common/ico_social_line.svg);
}
.ie .accounts__btn--line:before{
    background-image:url(../img/common/ico_social_line.png);
}
.accounts__btn--is:before{
    height:1.65em;
    background-image:url(../img/common/ico_social_is.svg);
}
.accounts__btn--tt{
  background: #000;
}
.accounts__btn--tt:hover{
  background: #333;
}
.accounts__btn--tt:before{
    background-image:url(../img/common/ico_social_tiktok.svg);
}
.accounts__btn--x{
  background: #000;
}
.accounts__btn--x:hover{
  background: #333;
}
.accounts__btn--x:before{
    background-image:url(../img/common/ico_social_x.svg);
}
.no-flexbox .accounts{
    text-align:center;
}
.no-flexbox .accounts__btn{
    display:inline-block;
    width:100%;
    padding:10px;
}
.no-flexbox .accounts__btn:before,
.no-flexbox .accounts__btn:after{
    display:none;
}
@media screen and (min-width: 380px) {
    .accounts__btn{
        font-size:1.1rem;
    }
}
@media screen and (min-width: 768px) {
    .accounts{
        display:-webkit-flex;
        display:flex;
        -webkit-flex-wrap:wrap;
        flex-wrap:wrap;
        max-width:890px;
        margin-left:auto;
        margin-right:auto;
        padding:0 10px;
    }
    .accounts__btn{
        -webkit-flex-basis:calc(50% - 10px);
        flex-basis:calc(50% - 10px);
        margin:5px;
        padding:0;
        height:4em;
        border:solid 5px #fff;
        border-radius:20px;
        font-size:2.75vw;
        line-height:1.25;
        overflow:hidden;
        white-space:normal;
    }
    .ie11 .accounts__btn{
      flex-basis:calc(50% - 20px);
    }
    .accounts__btn > span{
        -webkit-flex:1 1 auto;
        flex:1 1 auto;
    }
    .accounts__btn:before{
        margin-left:20px;
        width:2.5em;
        height:2.5em;
    }
    .accounts__btn--fb:before{
        height:2em;
    }
    .accounts__btn--is:before{
        height:2.5em;
    }
    .accounts__btn:after{
        content:"";
        display:block;
        background:url(../img/common/ico_arrow_white.svg) no-repeat 50% 50% #2a497d;
        background-size:0.75em auto;
        -webkit-flex:0 0 2em;
        flex:0 0 2em;
        height:100%;
        margin-left:15px;
    }
    .accounts__btn--tw:after{
        background-color:#2f88ca;
    }
    .accounts__btn--yt:after{
        background-color:#a50000;
    }
    .accounts__btn--line:after{
        background-color:#00a407;
    }
    .accounts__btn--is:after{
        background-color:#335585;
    }
    .accounts__btn--tt::after{
      background-color: #444;
    }
    .accounts__btn--x::after{
      background-color: #444;
    }
    .no-flexbox .accounts__btn{
        width:45%;
    }
}
@media screen and (min-width: 920px) {
    .accounts__btn{
        font-size: 1.6rem;
    }
}

/*=========
 social share
=========*/
.social{
    display:-webkit-flex;
    display:flex;
    -webkit-justify-content:center;
    justify-content:center;
    margin:35px auto;
    letter-spacing:-0.4em;
}
.social__btn{
    display:-webkit-flex;
    display:flex;
	-webkit-align-items:center;
	align-items:center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-flex:0 0 15vw;
    flex:0 0 15vw;
    margin: 0.5em;
    height:15vw;
    border:solid 2px #008fde;
    border-radius:8px;
    background: #008fde;
    background: linear-gradient(
        #4db1e8 50%,
        #008fde 50.1%,
        #008fde 95%,
        #4db1e8 95.1%
    );
    letter-spacing:normal;
    text-align:center;
}
.social__btn > *{
    display:-webkit-flex;
    display:flex;
	-webkit-align-items:center;
	align-items:center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-flex:0 1 60%;
    flex:0 1 60%;
    height:60%;
}
.social__btn--tw > *{
    -webkit-flex:0 1 62%;
    flex:0 1 62%;
    height:62%;
}
.social__btn--gplus > *{
    -webkit-flex:0 1 54%;
    flex:0 1 54%;
    height:54%;
}
.social__btn--line > *{
    -webkit-flex:0 1 63%;
    flex:0 1 63%;
    height:63%;
}
.social__btn img{
    width:100%;
    height:auto;
}
.social__btn--fb img{
    width:auto;
    height:100%;
}
.social__btn:first-child{
    margin-left:0;
}
.social__btn:last-child{
    margin-right:0;
}
.social__btn:hover{
    background: #4db1e8;
    background: linear-gradient(
        #4db1e8 5%,
        #008fde 5.1%,
        #008fde 50%,
        #4db1e8 50.1%
    );
}

.social__btn--fb{
    border-color:#2a5b9f;
    background: #2a5b9f;
    background: linear-gradient(
        #6a8dbc 50%,
        #2a5b9f 50.1%,
        #2a5b9f 95%,
        #6a8dbc 95.1%
    );
}
.social__btn--fb:hover{
    background: #6a8dbc;
    background: linear-gradient(
        #6a8dbc 5%,
        #2a5b9f 5.1%,
        #2a5b9f 50%,
        #6a8dbc 50.1%
    );
}
.social__btn--tw{
    border-color:#2fa6de;
    background: #2fa6de;
    background: linear-gradient(
        #6ec1e8 50%,
        #2fa6de 50.1%,
        #2fa6de 95%,
        #6ec1e8 95.1%
    );
}
.social__btn--tw:hover{
    background: #6ec1e8;
    background: linear-gradient(
        #6ec1e8 5%,
        #2fa6de 5.1%,
        #2fa6de 50%,
        #6ec1e8 50.1%
    );
}

.social__btn--x{
  border-color:#000;
  background: #000;
  background: linear-gradient(
      #333 50%,
      #000 50.1%,
      #000 95%,
      #333 95.1%
  );
}
.social__btn--x:hover{
  background: #6ec1e8;
  background: linear-gradient(
      #333 5%,
      #000 5.1%,
      #000 50%,
      #333 50.1%
  );
}
.social__btn--gplus{
    border-color:#dd4b39;
    background: #dd4b39;
    background: linear-gradient(
        #e78175 50%,
        #dd4b39 50.1%,
        #dd4b39 95%,
        #e78175 95.1%
    );
}
.social__btn--gplus:hover{
    background: #e78175;
    background: linear-gradient(
        #e78175 5%,
        #dd4b39 5.1%,
        #dd4b39 50%,
        #e78175 50.1%
    );
}
.social__btn--line{
    border-color:#00c300;
    background: #00c300;
    background: linear-gradient(
        #4dd54d 50%,
        #00c300 50.1%,
        #00c300 95%,
        #4dd54d 95.1%
    );
}
.social__btn--line:hover{
    background: #4dd54d;
    background: linear-gradient(
        #4dd54d 5%,
        #00c300 5.1%,
        #00c300 50%,
        #4dd54d 50.1%
    );
}
.no-flexbox .social{
    text-align:center;
}
.no-flexbox .social__btn{
    display:inline-block;
    width:20vw;
    height:20vw;
    margin:5px;
    padding:5px;
    vertical-align:bottom;
}
.no-flexbox.no-cssvwunit .social__btn{
    width:60px;
    height:60px;
}
@media screen and (min-width: 380px) {
    .social__btn{
        -webkit-flex:0 0 60px;
        flex:0 0 60px;
        height:60px;
    }
    .no-flexbox .social__btn{
        width:90px;
        height:90px;
        padding:15px;
    }
 }
@media screen and (min-width: 768px) {
    .social{
        max-width:675px;
        margin:30px auto 60px;
    }
    .social__btn{
        -webkit-flex:0 0 95px;
        flex:0 0 95px;
        height:95px;
        margin: 0.75em;
        box-shadow:0 0 0 5px #fff;
        border-radius:20px;
        border-width:5px;
    }
}


/*=========
 利用できるコンビニリスト
=========*/
.cvs{
	display:flex;
	align-items:center;
  justify-content: center;
  flex-wrap: wrap;
  list-style:none;
  margin: 0;
  padding:0;
}
.mainhdr__cvs{
  margin:15px -4%;
  max-width:590px;
}
*::-ms-backdrop, .cvs{
  display: block;
}
*::-ms-backdrop, .cvs::after{
  content: "";
  display: table;
  clear: both;
}
.cvs > li{
  margin: 0.25vw 3%;
  display: flex;
  flex:0 1 auto;
  align-items: center;
}
*::-ms-backdrop, .cvs > li{
  display: block;
  width: 20%;
  float: left;
}
*::-ms-backdrop, .cvs > li:nth-of-type(1){
  width: 10%;
}
*::-ms-backdrop, .cvs > li:nth-of-type(5){
  width: 12%;
}

.cvs__name__inner{
  display:flex;
	align-items:center;
  justify-content: center;
  width: 100%;
  height: 100%;
}
*::-ms-backdrop, .cvs__name__inner{
  display: block;
}

.cvs > .cvs__name--711{
	flex-basis: calc(25.3% * 0.4); /* 33.3% - (4% * 2) */
}
.cvs > .cvs__name--711 > .cvs__name__inner{
  margin-left: 10%;
  margin-right: -5%;
}
.cvs > .cvs__name--lawson{
  flex-basis: calc(25.3% * 1.2);
}
.cvs > .cvs__name--family{
  flex-basis: calc(25.3% * 1.4);
}
.cvs > .cvs__name--family > .cvs__name__inner{
  margin-bottom: -0.5%;
}
.cvs > .cvs__name--poplar{
  flex-basis: 24%;
}
.cvs > .cvs__name--poplar > .cvs__name__inner{
  margin-bottom: 1%;
}
.cvs > .cvs__name--ministop{
  flex-basis: 14%;
  margin-left: 0;
}
.cvs > .cvs__name--ministop > .cvs__name__inner{
  margin-bottom: 1.5%;
}
.cvs > .cvs__name--seicomart{
  flex-basis: 27%;
  margin-left: 0;
}
.cvs > .cvs__name--daily{
  flex-basis: 13%;
  margin-left: 0;
}
.cvs > .cvs__name--daily > .cvs__name__inner{
}
.cvs > .cvs__name--filler{
  color: #094;
  white-space: nowrap;
  font-size: 5vw;
}
.cvs > li{
  text-align: center;
}
@media screen and (min-width: 558px) {
  .cvs{
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (min-width: 645px) {
  .cvs > .cvs__name--filler{
    font-size: 2em;
  }
}
@media screen and (min-width: 768px) {
  .cvs > li{
    margin: 0.2em 0.75em;
  }
  .cvs > .cvs__name--711{
    flex-basis: 7%;
  }
  .cvs > .cvs__name--lawson{
    flex-basis: 27%;
  }
  .cvs > .cvs__name--family{
    flex-basis: 34%;
  }
  .cvs > .cvs__name--poplar{
    flex-basis: 18%;
  }
  .cvs > .cvs__name--poplar > .cvs__name__inner{
    margin-bottom: 6%;
  }
  .cvs > .cvs__name--ministop{
    flex-basis: 10%;
  }
  .cvs > .cvs__name--daily{
    flex-basis: 10%;
  }
  .cvs > .cvs__name--seicomart{
    flex-basis: 20%;
  }
  .cvs > .cvs__name--filler{
    margin: 0 1em !important;
    font-size: 2.5vw;
  }
}
@media screen and (min-width: 1024px) {
  .cvs > .cvs__name--filler{
    font-size: 1.8em;
  }
}

@media screen and (min-width: 1054px) {
  .ftrcvs{
    width: 860px;
    margin: 0 auto;
  }
  .cvs{
    list-style:none;
  }
  .cvs > li{
    margin: 0.2em 0.75em !important;
  }
  .cvs > li > .cvs__name__inner{
    margin: 0 !important;
  }
  .cvs > .cvs__name--711{
    flex-basis: 4.5%;
  }
  .cvs > .cvs__name--lawson{
    flex-basis: 16%;
  }
  .cvs > .cvs__name--family{
    flex-basis: 19%;
  }
  .cvs > .cvs__name--poplar{
    flex-basis: 12%;
  }
  .cvs > .cvs__name--ministop{
    flex-basis: 6%;
  }
  .cvs > .cvs__name--seicomart{
    flex-basis: 14%;
  }
  .cvs > .cvs__name--daily{
    flex-basis: 7%;
  }
}

/*=========
 フッター
=========*/

.mainftr{
  color: #fff;
  background: #f01586;
  margin:30px auto 0;
  padding: 15px 0;
  text-align: center;
}
.mainftr li{
  display: inline-block;
  margin: 0;
}
.mainftr__totop{
  position: fixed;
  bottom: 5px;
  right: 5px;
  width: 42px;
  height: 42px;
  z-index: 10;
}
.mainftr__totop a{
  display: block;
  width: 100%;
  height: 100%;
}
.mainftr__copy{
  font-size: 0.6rem;
}
.mainftr__nav{
  margin: 0.5em 0 1em;
  letter-spacing: -0.4em;
}
.mainftr__nav a{
  display: inline-block;
  border-left: solid 1px #fff;
  border-right: solid 1px #fff;
  color: #fff;
  margin: 0.4em -1px 0.4em 0;
  padding: 0 0.7em;
  font-size: 94%;
  line-height: 1;
  letter-spacing: normal;
  text-decoration: none;
}
@media screen and (min-width: 768px) {
  .mainftr{
    margin: 30px 0 0;
    padding: 50px;
  }
  .mainftr__totop{
    display: none;
  }
  .mainftr__copy{
    font-size: 0.94rem;
  }
  .mainftr__nav{
    margin: 0 0 30px;
  }
  .mainftr__nav a{
    font-size: 1rem;
    padding: 0 1.1em;
  }
}
@media screen and (min-width: 920px) {
  .mainftr__nav a{
    font-size: 1.2rem;
  }
}

/*=========
 ページ全体
=========*/
.main{
  margin: 0 auto;
  padding: 46px 0 0;
}

@media screen and (min-width: 768px) {
  .main{
    padding: 0 15px;
    max-width: 1024px;
  }
}

@media screen and (min-width: 1054px) {
  .main{
    padding: 0;
  }
}



/*=========
 各ページ設定：トップページ
=========*/
.topcatch{
  margin: 10vw auto 20px;
  background: url(../img/top/bg_topcatch_sp.jpg) no-repeat top left;
  background-size: 100% auto;
}
.topcatch__txtarea{
  padding-top: 42vw;
  margin: 0 auto;
}
.topcatch__txt{
  margin: 0 auto 20px;
  padding: 0 15px;
  font-weight: bold;
}

@media screen and (min-width: 768px) {
  .topcatch{
    margin: 30px auto 40px;
    background: url(../img/top/bg_topcatch_pc.jpg) no-repeat top left;
    background-size: 100% auto;
  }
  .topcatch__txtarea{
    padding: 200px 0 0 260px;
    background: url(../img/top/img_topcatch_txt.jpg) no-repeat left 0 top 180px;
    background-size: 240px auto;
  }
  .topcatch__txt{
    margin: 0 auto 10px;
    padding: 0;
  }
}

.cts{
  margin: 0 auto 45px;
}
.cts__ttl{
  margin: 0 auto 20px;
  width: 100%;
  height: 15.9vw;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}
.cts__ttl--shomei{
  background: url(../img/top/ctsttl_shomei_sp.jpg) no-repeat center top;
  background-size: cover;
}
.cts__ttl--garapon{
  background: url(../img/top/ctsttl_garapon_sp.jpg) no-repeat center top;
  background-size: cover;
}
.cts__ttl--myca{
  background: url(../img/top/ctsttl_myca_sp.jpg) no-repeat center top;
  background-size: cover;
}
.cts__ttl--picchan{
  background: url(../img/top/ctsttl_picchan_sp.jpg) no-repeat center top;
  background-size: cover;
}
.cts__main{
  margin: 0 15px;
}
.cts__catch{
  font-weight: bold;
  margin-bottom: 2em;
}
.cts__catch > span{
  display: block;
  text-indent: -1em;
  padding: 0 0 0 1em;
}

@media screen and (min-width: 768px) {
  .cts{
    margin: 0 auto 50px;
  }
  .cts__ttl{
    width: 100%;
    height: 8.39vw;
  }
  .cts__ttl--shomei{
    background: url(../img/top/ctsttl_shomei_pc.jpg) no-repeat center top;
    background-size: calc(100vw - 30px) 8.39vw;
  }
  .cts__ttl--garapon{
    background: url(../img/top/ctsttl_garapon_pc.jpg) no-repeat center top;
    background-size: calc(100vw - 30px) 8.39vw;
  }
  .cts__ttl--myca{
    background: url(../img/top/ctsttl_myca_pc.jpg) no-repeat center top;
    background-size: calc(100vw - 30px) 8.39vw;
  }
  .cts__ttl--picchan{
    background: url(../img/top/ctsttl_picchan_pc.jpg) no-repeat center top;
    background-size: calc(100vw - 30px) 8.39vw;
  }
  .cts__main{
    margin: 0 25px;
  }
}

@media screen and (min-width: 1054px) {
  .cts__ttl{
    max-width: 1024px;
    width: 1024px;
    height: 86px;
  }
  .cts__ttl--shomei{
    background: url(../img/top/ctsttl_shomei_pc.jpg) no-repeat center top;
    background-size: 1024px 86px;
  }
  .cts__ttl--garapon{
    background: url(../img/top/ctsttl_garapon_pc.jpg) no-repeat center top;
    background-size: 1024px 86px;
  }
  .cts__ttl--myca{
    background: url(../img/top/ctsttl_myca_pc.jpg) no-repeat center top;
    background-size: 1024px 86px;
  }
  .cts__ttl--picchan{
    background: url(../img/top/ctsttl_picchan_pc.jpg) no-repeat center top;
    background-size: 1024px 86px;
  }
}

/* ポイント */
.point{
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 0 auto 35px;
}
.point__img{
  width: 50%;
  margin: 0;
}
.point__txt{
  width: 49%;
  list-style: none;
}
.point__txt__li{
  margin: 0 auto;
  height: 18vw;
  border-radius:15px;
  position: relative;
}
.point__shomei1{
  background: #e3007f url(../img/top/point_shomei1_sp.jpg) no-repeat 50% 50%;
  background-size: auto 56%;
}
.point__shomei2{
  background: #f29600 url(../img/top/point_shomei2_sp.jpg) no-repeat 50% 50%;
  background-size: auto 56%;
}
.point__shomei3{
  background: #49a848 url(../img/top/point_shomei3_sp.jpg) no-repeat 50% 50%;
  background-size: auto 56%;
}
.point__garapon1{
  background: #e3007f url(../img/top/point_garapon1_sp.jpg) no-repeat 50% 50%;
  background-size: auto 56%;
}
.point__garapon2{
  background: #f29600 url(../img/top/point_garapon2_sp.jpg) no-repeat 50% 50%;
  background-size: auto 56%;
}
.point__garapon3{
  background: #49a848 url(../img/top/point_garapon3_sp.jpg) no-repeat 50% 50%;
  background-size: auto 56%;
}
.point__myca1{
  background: #e3007f url(../img/top/point_myca1_sp.jpg) no-repeat 50% 50%;
  background-size: auto 56%;
}
.point__myca2{
  background: #f29600 url(../img/top/point_myca2_sp.jpg) no-repeat 50% 50%;
  background-size: auto 56%;
}
.point__myca3{
  background: #49a848 url(../img/top/point_myca3_sp.jpg) no-repeat 50% 50%;
  background-size: auto 56%;
}
.point__txt__li:not(:last-child){
  margin: 0 auto 10px
}
.point__txt__li::after{
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: -7px;
  margin-top: -7px;
  border-top: solid transparent 7px;
  border-bottom: solid transparent 7px;
}
.point__txt__li1::after{
  border-right: solid #e4007f 14px;
}
.point__txt__li2::after{
  border-right: solid #f29600 14px;
}
.point__txt__li3::after{
  border-right: solid #49a848 14px;
}
.point__txt__point{
  display: none;
}
.point__txt__main{
  display: none;
}

@media screen and (min-width: 768px) {
  .point__txt__li{
    height: auto;
    background-size: auto;
    border-radius:15px;
  }
  .point__txt__li1{
    background: #e4007f;
    border: solid 4px #ffaed2;
  }
  .point__txt__li2{
    background: #f29600;
    border: solid 4px #fabe00;
  }
  .point__txt__li3{
    background: #49a848;
    border: solid 4px #8ebf6a;
  }
  .point__txt__li::before{
    content: "";
    display: block;
    width: 0;
    height: 0;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 50%;
    left: -24px;
    margin-top: -15px;
    border-top: solid transparent 24px;
    border-bottom: solid transparent 24px;
    border-radius: 0;
    background: none;
  }
  .point__txt__li1::before{
    border-right: solid #ffaed2 24px;
  }
  .point__txt__li2::before{
    border-right: solid #fabe00 24px;
  }
  .point__txt__li3::before{
    border-right: solid #8ebf6a 24px;
  }
  .point__txt__li:not(:last-child){
    margin: 0 auto 15px
  }
  .point__txt__li::after{
    left: -18px;
    margin-top: -9px;
    border-top: solid transparent 18px;
    border-bottom: solid transparent 18px;
  }
  .point__txt__li1::after{
    border-right: solid #e4007f 18px;
  }
  .point__txt__li2::after{
    border-right: solid #f29600 18px;
  }
  .point__txt__li3::after{
    border-right: solid #49a848 18px;
  }
  .point__txt__point{
    display: block;
    background: #fff;
    padding: 0.75em 4em;
    border-radius: 11px 11px 0 0;
    text-align: center;
  }
  .point__txt__li1 > .point__txt__point{
    border-bottom: solid 4px #ffaed2;
  }
  .point__txt__li2 > .point__txt__point{
    border-bottom: solid 4px #fabe00;
  }
  .point__txt__li3 > .point__txt__point{
    border-bottom: solid 4px #8ebf6a;
  }
  .point__txt__point > img{
    width: auto;
    height: 20px;
    }
  .point__txt__main{
    display: block;
    padding: 1.75em 2em;
  }
}

@media screen and (min-width: 1054px) {
  .point__img{
    width: 490px;
  }
  .point__txt{
    width: 475px;
  }
}

/* 動画 */
.movie{
  margin: 0 auto 20px;
}
.movie__ttl{
  text-align: center;
  margin: 0 auto;
  font-size: 1rem;
  line-height: 1;
  padding: 0.75em 0;
  color: #fff;
}
.movie__ttl--shomei{
  background: #f01586;
}
.movie__ttl--garapon{
  background: #46c53d;
}
.movieframe{
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.movieframe > iframe{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border:none;
}

@media screen and (min-width: 768px) {
  .movie{
    margin: 0 auto 45px;
  }
  .movie__ttl{
    margin: 0 auto 35px;
  }
  .movie{
    background: #eee;
    padding: 0 0 35px;
  }
  .movieframe{
    width:450px;
    height:252px;
    margin:0 auto;
    padding:0;
  }
}

/* ボタンエリア */
.btnarea{
  text-align: center;
}
.btn{
  display:block;
  margin:0 auto;
  padding:0.8em;
  line-height:1;
  border:solid 2px #f01586;
  border-radius:13px;
  background: #f01586;
  background: linear-gradient(
    #f55cab 50%,
    #f01586 50.1%,
    #f01586 93%,
    #f55cab 93.1%
  );
  color:#fff;
  text-align:center;
  font-weight:bold;
  text-decoration:none;
  text-shadow:#f01586 -1px -1px 0;
  padding:0.75em 1em;
  font-size:1.47rem;
  min-width:8em 0;
  text-align:center;
}
.btn:hover{
  background: #f55cab;
  background: linear-gradient(
    #f55cab 4.8%,
    #f01586 4.9%,
    #f01586 50%,
    #f55cab 50.1%
  );
}
.btn--green{
  border:solid 2px #5cc83b;
  background: #5cc83b;
  background: linear-gradient(
    #8dd976 50%,
    #5cc83b 50.1%,
    #5cc83b 93%,
    #8dd976 93.1%
  );
  text-shadow:#5cc83b -1px -1px 0;
}
.btn--green:hover{
  background: #8dd976;
  background: linear-gradient(
    #8dd976 4.8%,
    #5cc83b 4.9%,
    #5cc83b 50%,
    #8dd976 50.1%
  );
}
.btnlist{
  display: flex;
  justify-content: space-between;
  margin: 1em auto;
  padding: 0;
  text-align: center;
}
.btnlist > li{
  list-style: none;
  width: 29%;
}
.btnlist > li > a{
  display: block;
  text-decoration: none;
  font-weight: bold;
  color: #fff;
  font-size: 1.2rem;
  text-align: center;
  line-height: 1;
  padding: 1.5em 0;
  border-radius: 13px;
}
.btnlist > li > a::before{
  content: "→"
}
.btnlist > li > a > span{
  display: none;
}
.btnlist__web > a{
  background: #ff7dc6;
}
.btnlist__app > a{
  background: #ffa949;
}
.btnlist__line > a{
  background: #46c53d;
}
.btnmore{
  display: block;
  text-decoration: none;
  font-weight: bold;
  font-size: 1.2rem;
  text-align: center;
  line-height: 1;
  padding: 0.7em 0;
  border-radius: 13px;
  background: #fff;
  color: #f01586;
  border: solid 2px #f01586;
  width: 70%;
  margin: 0 auto;
}
.btnmore--green{
  color: #5cc83b;
  border: solid 2px #5cc83b;
}
.btnmore::before{
  content: "→"
}

@media screen and (min-width: 768px) {
  .btnarea__garapon{
    display: flex;
    justify-content: space-between;
  }
  .btnarea__garapon > p{
    width: 48%;
  }
  .btn{
    display:inline-block;
    border-width:5px;
    border-radius:15px;
    padding:0.8em 0;
    width:60%;
    font-size:2rem;
  }
  .btnarea__garapon > p >.btn--green{
    width:100%;
  }
  .btnlist{
    display: flex;
    justify-content: center;
  }
  .btnlist > li{
    width: 260px;
  }
  .btnlist > li:not(:last-child){
    margin-right: 35px;
  }
  .btnlist > li > a{
    font-size: 1.7rem;
    padding: 0.8em 0;
  }
  .btnlist > li > a > span{
    display: inline-block;
  }
  .btnmore{
    width: 350px;
  }
}

/* ラインナップ */
.lineup{
  margin: 0 auto;
  padding: 0;
  width: 60%;
}
.lineup > li{
  list-style: none;
  margin: 0 0;
}
.lineup > li:not(:last-child){
  margin: 0 0 30px;
}
.lineup__list{
  margin: 0 auto;
}
.lineup__img{
  margin: 0 auto;
}
.lineup__ttl{
  font-weight: bold;
}
.lineup__txt{
  font-weight: bold;
}

@media screen and (min-width: 768px) {
  .lineup{
    display: flex;
    justify-content: space-between;
    width: 100%;
  }
  .lineup > li{
    width: 32%;
    max-width: 300px;
  }
  .lineup > li:not(:last-child){
    margin: 0;
  }
}



/*=========
 各ページ設定：ラインナップ / 買いかた
=========*/
.cts--picchan{
  margin: 3px auto 45px;
}
.picchannav{
  padding: 0;
  display: flex;
}
.picchannav > li{
  list-style: none;
  margin: 0;
}
.picchannav > li:not(:last-child){
  margin-right: 2em;
}
.subttl{
  color: #fff;
  background: #ff70ab;
  line-height: 1;
  padding: 0.8em;
}
@media screen and (min-width: 768px) {
  .cts{
    margin: 45px auto 50px;
  }
}


/* クター */
.kutar1{
  margin: 0 auto 50px;
}
.kutar1__img{
  margin: 0;
  text-align: center;
}
.kutar1__imglist{
  margin: 0;
  padding: 0;
  text-align: center;
}
.kutar1__imglist > li{
  list-style: none;
  margin: 0;
}
.kutar1__imglist > li:not(:last-child){
  margin-bottom: 15px;
}
.kutar1__imglist > li > span{
  display: block;
  text-align: left;
  font-size: 0.8em;
  margin-left: calc(50% - 100px);
}
.kutar1__txt{
  text-align: center;
  margin: 0 auto 1em;
  font-size: 0.9em;
}
.kutar1__ttl{
  font-weight: bold;
  margin: 0 auto 0.5em;
  text-align: center;
}
.kutar1__num{
  padding: 0;
  margin: 0;
  display: inline-block;
}
.kutar1__num > li{
  list-style: none;
  margin: 0;
  text-align: left;
  font-weight: bold;
}
.kutar1__num .numttl{
  display: inline-block;
  width: 12em;
  font-weight: normal;
}
.kutar1__num .numred{
  color: #ff0000;
}
.kutar2__list{
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
}
.kutar2__list > li{
  list-style: none;
  margin: 0;
  width: 49%;
}
.kutar2__list > li:nth-child(odd){
  margin-right: 2%;
}
.kutar2__ttl{
  text-align: left;
  font-size: 0.9em;
  font-weight: bold;
}
.kutar2__num{
  margin: 0;
  padding: 0;
}
.kutar2__num > li{
  list-style: none;
  margin: 0;
  font-weight: bold;
}
.kutar2__num .numttl{
  display: inline-block;
  width: 4em;
  font-weight: normal;
}

@media screen and (min-width: 768px) {
  .kutar1{
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
  }
  .kutar1__imglist{
    display: flex;
    align-items: flex-end;
  }
  .kutar1__imglist > li:not(:last-child){
    margin-bottom: 0;
  }
  .kutar1__ttl{
    text-align: left;
  }
  .kutar1__txt{
    margin: 0 1em 0 0;
    text-align: left;
  }
  .kutar2__list > li:nth-child(odd){
    margin: 0 2em 0 0;
  }
  .kutar2__list > li{
    width: 30%;
    margin: 0 2% 20px 0;
  }
  .kutar2__list > li:nth-child(odd){
    margin: 0 2% 20px 0;
  }
}

@media screen and (min-width: 1054px) {
  .kutar2__list > li{
    width: 215px;
    margin: 0 20px 20px 0;
  }
  .kutar2__list > li:nth-child(odd){
    margin: 0 20px 20px 0;
  }
}

/* ペラモデル */
.paper__list{
  margin: 0;
  padding: 0;
}
.paper__list > li{
  list-style: none;
  padding: 0;
  margin: 0;
}
.paper__list > li:not(:last-child){
  margin-bottom: 40px;
}
.paper__item{
  text-align: center;
}
.paper__imgarea{
  display: flex;
  align-items: flex-end;
  margin: 0 auto 10px;
}
.paper__sheet{
  margin: 0 10px 0 0;
  width: 40%;
}
.paper__sheet.sheet_w{
  width: 50%;
}
.paper__sheet > span{
  display: block;
  color: #ff8000;
  text-align: center;
}
.paper__img{
  margin: 0;
  width: calc(60% - 10px);
}
.paper__img.sheet_w{
  width: calc(50% - 10px);
}
.paper__img > span{
  display: block;
  text-align: center;
}
.paper__num{
  margin: 0;
  padding: 0;
}
.paper__num > li{
  list-style: none;
  padding: 0;
  margin: 0;
}
.paper__num > li > span{
  font-weight: bold;
}
.paper__num .numblue{
  color: #0080c0;
}

@media screen and (min-width: 768px) {
  .paper__list{
    display: flex;
    flex-wrap: wrap;
  }
  .paper__list > li{
    width: 50%;
  }
  .paper__list > li:nth-child(odd){
    width: 48%;
    margin-right: 2%;
  }
}


/* 江戸古地図 */
.edo{
  
}
.edo__notes{
  padding: 0;
}
.edo__notes > li{
  list-style: none;
  font-size: 0.9em;
  color: #666;
  text-indent: -1em;
  padding: 0 0 0 1em;
  margin: 0 auto 0.3em;
}
.edo__notes > li::before{
  content: "※";
}
.edo__map{
  margin: 0 auto 2em;
}
.edo__ttl{
  color: #ff70ab;
  line-height: 1;
  padding: 0 0 0.3em 0.2em;
  border-bottom: solid 2px #ff70ab;
}
.edo__list{
  display: flex;
  flex-wrap: wrap;
}
.edo__listcolumn{
  width: 50%;
  border: solid 1px #ccc;
  margin-bottom: 40px;
  background: #fffbdc;
}
.edo__list.present > .edo__listcolumn{
  background: #f0f8fb;
}
.edo__listcolumn:nth-child(even){
  background: #fdf6c0;
  border-left: none;
}
.edo__list.present > .edo__listcolumn:nth-child(even){
  background: #daeef9;
}
.edd__item{
  padding: 0.2em 0.4em;
}
.edd__item:not(:last-child){
  border-bottom: solid 1px #ccc;
}
.edo__itemttl{
  color: #ff0000;
  font-weight: bold;
  margin: 0;
}
.edo__itemnum{
  padding: 0;
  margin: 0;
}
.edo__itemnum > li{
  margin: 0;
  list-style: none;
  font-size: 0.9em;
  font-weight: bold;
}
.edo__itemnum > li:last-child{
  color: #008080;
}
.edo__copyright{
  font-size: 0.9em;
  color: #666;
  text-align: right;
  margin: 2em auto 0;
}

@media screen and (min-width: 768px) {
  .edo__listcolumn{
    width: 33.3%;
    margin-bottom: 20px;
  }
  .edo__listcolumn:nth-child(even){
    background: #fffbdc;
    border: solid 1px #ccc;
  }
  .edo__list.present > .edo__listcolumn:nth-child(even){
    background: #f0f8fb;
  }
  .edo__listcolumn:nth-child(3n-1){
    background: #fdf6c0;
    border-left: none;
    border-right: none;
  }
  .edo__list.present > .edo__listcolumn:nth-child(3n-1){
    background: #daeef9;
  }
}

@media screen and (min-width: 1054px) {
  .edo__listcolumn{
    width: 25%;
    border-right: none;
  }
  .edo__listcolumn:nth-child(3n-1){
    background: #fffbdc;
    border: solid 1px #ccc;
    border-right: none;
  }
  .edo__list.present > .edo__listcolumn:nth-child(3n-1){
    background: #f0f8fb;
  }
  .edo__listcolumn:nth-child(even){
    background: #fdf6c0;
  }
  .edo__list.present > .edo__listcolumn:nth-child(even){
    background: #daeef9;
  }
  .edo__listcolumn:nth-child(6){
    border-right: none;
  }
  .edo__listcolumn:nth-child(7){
    border-right: solid 1px #ccc;
  }
}


/* 買いかた */
.buy{
}
.buy__seven{
  font-size: 1.2rem;
  font-weight: bold;
}
.buy__seven > img{
  width: 2em;
  height: auto;
  vertical-align: middle;
  margin-right: 0.5em;
}
.buy__seven > span{
  color: #f08200;
}
.buy__list{
  margin: 0;
  padding: 0;
}
.buy__list > li{
  margin: 0;
}
.buy__list > li:not(:last-child){
  margin: 0 auto 40px;
}
.buy__list > li::before{
  content: none;
}
.buy__flow{
  margin: 0;
}
.buy__flowttl{
  margin: 0 0 0.6em 0.8em;
  padding: 0.2em 0 0.2em 1.2em;
  background: #f08200;
  color: #fff;
  position: relative;
}
.buy__flowttl > span{
  display: inline-block;
  width:1.8em;
  height:1.8em;
  background:#009844;
  color:#fff;
  border-radius:50%;
  font-size:1em;
  font-family: 'Roboto', sans-serif;
  font-weight:bold;
  text-align:center;
  line-height:1;
  padding: 0.3em 0 0 0;
  vertical-align:middle;
  position: absolute;
  left: -0.8em;
  top: calc(50% - 0.9em);
}
.buy__flowcts{
  padding: 0 1em;
}
.buy__flowimg{
  border: solid 1px #ccc;
  margin: 0 auto 10px;
}
.buy__flowtxt{
  margin: 0;
  font-size: 0.9em;
  display: block;
}
.buy__flowtxt > span{
  display: block;
  text-indent: -1em;
  padding: 0 0 0 1em;
}

@media screen and (min-width: 768px) {
  .buy__flowcts{
    display: flex;
  }
  .buy__flowimg{
    margin: 0 10px 0 0;
    width: 40%;
  }
  .buy__flowtxt{
    width: calc(60% - 10px);
  }
}

/*

★キャッチ文の※部分を調整（<span>で囲ってインデントずらす？）
★フロー画像をダウンロード

→各ページのテキストを入れる
 インクルード化→テストアップ
*/
