@charset "UTF-8";
/* normalize.css 2012-07-07T09:50 UTC - http://github.com/necolas/normalize.css */
/* ==========================================================================
   HTML5 display definitions
   ========================================================================== */
/**
 * Correct `block` display not defined in IE 8/9.
 */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
  display: block; }

/**
 * Correct `inline-block` display not defined in IE 8/9.
 */
audio,
canvas,
video {
  display: inline-block; }

/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */
audio:not([controls]) {
  display: none;
  height: 0; }

/**
 * Address `[hidden]` styling not present in IE 8/9.
 * Hide the `template` element in IE, Safari, and Firefox < 22.
 */
[hidden],
template {
  display: none; }

/* ==========================================================================
   Base
   ========================================================================== */
/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS text size adjust after orientation change, without disabling
 *    user zoom.
 */
html {
  font-family: sans-serif;
  /* 1 */
  -ms-text-size-adjust: 100%;
  /* 2 */
  -webkit-text-size-adjust: 100%;
  /* 2 */ }

/**
 * Remove default margin.
 */
body {
  margin: 0; }

/* ==========================================================================
   Links
   ========================================================================== */
/**
 * Remove the gray background color from active links in IE 10.
 */
a {
  background: transparent; }

/**
 * Address `outline` inconsistency between Chrome and other browsers.
 */
a:focus {
  outline: thin dotted; }

/**
 * Improve readability when focused and also mouse hovered in all browsers.
 */
a:active,
a:hover {
  outline: 0; }

/* ==========================================================================
   Typography
   ========================================================================== */
/**
 * Address variable `h1` font-size and margin within `section` and `article`
 * contexts in Firefox 4+, Safari 5, and Chrome.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0; }

/**
 * Address styling not present in IE 8/9, Safari 5, and Chrome.
 */
abbr[title] {
  border-bottom: 1px dotted; }

/**
 * Address style set to `bolder` in Firefox 4+, Safari 5, and Chrome.
 */
b,
strong,
.strong {
  font-weight: bold; }

/**
 * Address styling not present in Safari 5 and Chrome.
 */
dfn,
em,
.em {
  font-style: italic; }

/**
 * Address differences between Firefox and other browsers.
 */
hr {
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
  height: 0; }

/*
 * proper formatting (http://blog.fontdeck.com/post/9037028497/hyphens)
*/
p {
  -webkit-hyphens: auto;
  -epub-hyphens: auto;
  -ms-hyphens: auto;
      hyphens: auto; }

/*
 * Addresses margins set differently in IE6/7.
 */
pre {
  margin: 0; }

/**
 * Correct font family set oddly in Safari 5 and Chrome.
 */
code,
kbd,
pre,
samp {
  font-family: monospace, serif;
  font-size: 1em; }

/**
 * Improve readability of pre-formatted text in all browsers.
 */
pre {
  white-space: pre-wrap; }

/**
 * Set consistent quote types.
 */
q {
  quotes: "\201C" "\201D" "\2018" "\2019"; }

/**
 * Address inconsistent and variable font size in all browsers.
 */
q:before,
q:after {
  content: '';
  content: none; }

small, .small {
  font-size: 75%; }

/**
 * Prevent `sub` and `sup` affecting `line-height` in all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sup {
  top: -0.5em; }

sub {
  bottom: -0.25em; }

/* ==========================================================================
  Lists
========================================================================== */
/*
 * Addresses margins set differently in IE6/7.
 */
dl,
menu,
ol,
ul {
  margin: 1em 0; }

dd {
  margin: 0; }

/*
 * Addresses paddings set differently in IE6/7.
 */
menu {
  padding: 0 0 0 40px; }

ol,
ul {
  padding: 0;
  list-style-type: none; }

/*
 * Corrects list images handled incorrectly in IE7.
 */
nav ul,
nav ol {
  list-style: none;
  list-style-image: none; }

/* ==========================================================================
  Embedded content
========================================================================== */
/**
 * Remove border when inside `a` element in IE 8/9.
 */
img {
  border: 0; }

/**
 * Correct overflow displayed oddly in IE 9.
 */
svg:not(:root) {
  overflow: hidden; }

/* ==========================================================================
   Figures
   ========================================================================== */
/**
 * Address margin not present in IE 8/9 and Safari 5.
 */
figure {
  margin: 0; }

/* ==========================================================================
   Forms
   ========================================================================== */
/**
 * Define consistent border, margin, and padding.
 */
fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em; }

/**
 * 1. Correct `color` not being inherited in IE 8/9.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets.
 */
legend {
  border: 0;
  /* 1 */
  padding: 0;
  /* 2 */ }

/**
 * 1. Correct font family not being inherited in all browsers.
 * 2. Correct font size not being inherited in all browsers.
 * 3. Address margins set differently in Firefox 4+, Safari 5, and Chrome.
 */
button,
input,
select,
textarea {
  font-family: inherit;
  /* 1 */
  font-size: 100%;
  /* 2 */
  margin: 0;
  /* 3 */ }

/**
 * Address Firefox 4+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */
button,
input {
  line-height: normal; }

/**
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Chrome, Safari 5+, and IE 8+.
 * Correct `select` style inheritance in Firefox 4+ and Opera.
 */
button,
select {
  text-transform: none; }

/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 */
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  /* 2 */
  cursor: pointer;
  /* 3 */ }

/**
 * Re-set default cursor for disabled elements.
 */
button[disabled],
html input[disabled] {
  cursor: default; }

/**
 * 1. Address box sizing set to `content-box` in IE 8/9/10.
 * 2. Remove excess padding in IE 8/9/10.
 */
input[type="checkbox"],
input[type="radio"] {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */ }

/**
 * 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome
 *    (include `-moz` to future-proof).
 */
input[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  -webkit-box-sizing: content-box;
  /* 2 */
  box-sizing: content-box; }

/**
 * Remove inner padding and search cancel button in Safari 5 and Chrome
 * on OS X.
 */
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; }

/**
 * Remove inner padding and border in Firefox 4+.
 */
button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0; }

/**
 * 1. Remove default vertical scrollbar in IE 8/9.
 * 2. Improve readability and alignment in all browsers.
 */
textarea {
  overflow: auto;
  /* 1 */
  vertical-align: top;
  /* 2 */ }

/* ==========================================================================
   Tables
   ========================================================================== */
/**
 * Remove most spacing between table cells.
 */
table {
  border-collapse: collapse;
  border-spacing: 0; }

* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

.image-replacement,
.ir {
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden; }

.indent {
  padding-left: 1.5rem;
  text-indent: -1.5rem;
}

.clearfix, .cf {
  zoom: 1; }
  .clearfix:before, .clearfix:after, .cf:before, .cf:after {
    content: "";
    display: table; }
  .clearfix:after, .cf:after {
    clear: both; }

/*
use the best ampersand
http://simplebits.com/notebook/2008/08/14/ampersands-2/
*/
span.amp {
  font-family: Baskerville,'Goudy Old Style',Palatino,'Book Antiqua',serif !important;
  font-style: italic; }

/*
The following is based of Typebase:
https://github.com/devinhunt/typebase.css
I've edited it a bit, but it's a nice starting point.
*/
/*
 i imported this one in the functions file so bones would look sweet.
 don't forget to remove it for your site.
*/
/*
font color
*/
/*
general font setting
*/
html {
  font-size: 62.5%; }

body {
  font-size: 14px;
  font-size: 1.4em;
  line-height: 1.6;
  font-weight: 500;
  text-align: center;
  color: rgba(0, 0, 0, 0.87);
  overflow-wrap: break-word;
	word-wrap: break-word;
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
}

@font-face {
  font-family: 'icomoon';
  src: url("../fonts/icomoon.eot");
  src: url("../fonts/icomoon.eot#iefix") format("embedded-opentype"), url("../fonts/icomoon.ttf") format("truetype"), url("../fonts/icomoon.woff") format("woff"), url("../fonts/icomoon.svg#icomoon") format("svg");
  font-weight: normal;
  font-style: normal; }

[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

.icon-binder:before {
  content: "\e900"; }

.icon-calendar:before {
  content: "\e901"; }

.icon-hatebu:before {
  content: "B!";
    font-family: Verdana;
    font-weight: bold }

.icon-newspaper:before {
  content: "\e903"; }

/*********************
TRANSITION
*********************/
/*
I totally rewrote this to be cleaner and easier to use.
You'll need to be using Sass 3.2+ for these to work.
Thanks to @anthonyshort for the inspiration on these.
USAGE: @include transition(all 0.2s ease-in-out);
*/
/*********************
CSS3 GRADIENTS
Be careful with these since they can
really slow down your CSS. Don't overdo it.
*********************/
/* @include css-gradient(#dfdfdf,#f8f8f8); */
/*********************
BOX SIZING
*********************/
/* @include box-sizing(border-box); */
/* NOTE: value of "padding-box" is only supported in Gecko. So
probably best not to use it. I mean, were you going to anyway? */
/* BOX SHADOW */
/*********************
BASE (MOBILE) SIZE
*********************/
/*////////////////////
    GENERAL STYLE
////////////////////*/
html, body {
  width: 100%;
  height: 100%;
  background: #fff; }

section .inner, header .inner, footer .inner {
  max-width: 942px;
  text-align: left;
  margin: 0 auto; }

#wrapper {
  max-width: 940px;
  text-align: left;
  margin: 0 auto;
  padding: 4rem 0 2rem;
  overflow: hidden; }

main {
  max-width: 660px;
  margin: 0 30px 0 0;
  float: left; }

aside {
  max-width: 250px;
  float: right; }

a {
  color: rgba(0, 0, 0, 0.87);
  font-weight: 500;
  text-decoration: none;
  position: relative; }
  a:hover img, a:focus img {
    opacity: .8; }
  a img {
    -webkit-transition: 0.2s ease-in-out;
    -o-transition: 0.2s ease-in-out;
    transition: 0.2s ease-in-out; }

img {
  max-width: 100%;
  height: auto; }

/*////////////////////
    HEADER STYLE
////////////////////*/
header, #header {
  margin: 0; }

.site-header {
  padding: 2.5rem 0 2rem;
  border-bottom: 1px solid #ccc;
  overflow: hidden; }
  .site-header:before {
    display: block;
    content: "";
    height: 12px;
    width: 100%;
    background: url("../images/top-bdr.png");
    position: absolute;
    top: 0;
    left: 0; }
  .site-header .inner {
    position: relative; }
  .site-header img {
    display: block;
    width: 100%;
    height: auto; }
  .site-header #site-title ,
  .site-header #site-logo ,
  .site-header h1, .site-header h2 {
    margin-left: auto;
    margin-right: auto; }
  .site-header #site-title ,
  .site-header h1 {
    width: 37rem;
    margin-top: 0;
    margin-bottom: 0; }
  .site-header #site-logo ,
  .site-header h2 {
    width: 16.5rem;
    margin-top: 1rem;
    margin-bottom: 0; }
  .site-header .sns {
    position: absolute;
    top: 50%;
    right: 0;
    margin: 0;
    -webkit-transform: translateY(-50%) translateX(-50%);
        -ms-transform: translateY(-50%) translateX(-50%);
            transform: translateY(-50%) translateX(-50%); }
    .site-header .sns li {
      display: inline-block; }
      .site-header .sns li a, .site-header .sns li a:visited {
        display: block;
        width: 2.5rem;
        height: 2.5rem;
        text-align: center;
        line-height: 2.5rem;
        background: #ff6f80;
        color: #fff;
        border-radius: 50%;
        -webkit-transition: 0.2s ease-in-out;
        -o-transition: 0.2s ease-in-out;
        transition: 0.2s ease-in-out; }
        .site-header .sns li a:hover, .site-header .sns li a:focus, .site-header .sns li a:visited:hover, .site-header .sns li a:visited:focus {
          background: #ff546c; }

/*////////////////////
    FOOTER STYLE
////////////////////*/
.site-footer {
  text-align: center;
  color: rgba(255, 255, 255, 0.87);
  background: url("../images/top-bdr.png"), #ff546c; }
  .site-footer .inner {
    padding: 1rem 0 12rem;
    text-align: center; }
    .site-footer .inner p {
      margin: 0; }

/*////////////////////
    SIDE STYLE
////////////////////*/
aside .bnr {
  margin: 0 auto 5rem; }
  aside .bnr a {
    display: block;
    margin: 0 auto 1rem; }
    aside .bnr a img {
      display: block; }
    aside .bnr a:last-child {
      margin: 0 auto; }

aside .poplur-article > h5 ,
aside .poplur-article > h1 {
  padding: .8rem 0 .5rem;
  margin: 0 auto 1rem;
  text-align: center;
  color: rgba(255, 255, 255, 0.87);
  background: url("../images/top-bdr.png"), #ff546c;
  border-radius: .5rem;
  line-height: 1;
  font-size: 1.8rem; }

aside .poplur-article > input[type="button"] {
  padding: .5rem 0;
  margin-top: .5rem;
  font-size: 1.6rem;
  text-align: center;
  background: #fff;
  border: 1px solid rgba(255, 111, 128, 0.87);
  border-radius: 5rem;
  color: rgba(255, 111, 128, 0.87);
  width: 100%;
  outline: none;
  }
aside .poplur-article > input[type="button"]:hover {
  opacity: .5;
    -webkit-transition: 0.2s ease-in-out;
    -o-transition: 0.2s ease-in-out;
    transition: 0.2s ease-in-out; }


  /*////////////////////
    COMMON STYLE
////////////////////*/
.article-list article {
  margin: 0 auto 1rem; }
  .article-list article:last-child {
    margin: auto; }
  .article-list article time {
    font-size: 1.2rem;
    line-height: 1;
    margin: 0; }
    .article-list article time span {
      color: rgba(255, 111, 128, 0.87);
      margin: 0 .5rem 0 0; }
  .article-list article p ,
  .article-list article p ,
  .article-list article h1 {
    font-size: 1.6rem;
    font-weight: 300;
    line-height: 1.4;
    margin: .5rem 0 0; }
  .article-list article .txt {
    -webkit-transition: 0.2s ease-in-out;
    -o-transition: 0.2s ease-in-out;
    transition: 0.2s ease-in-out; }
  .article-list article a:hover, .article-list article a:focus, .article-list article a:visited:hover, .article-list article a:visited:focus {
    color: rgba(255, 111, 128, 0.87); }

.share li {
  display: inline-block;
  padding: 0 .3rem 0 0;
  line-height: 0; }
  .share li iframe {
    margin: 0 !important;
    padding: 0 !important; }
  .share li:first-child {
    line-height: .8; }
  .share li:last-child {
    padding: 0; }

.topBtn {
  margin: 0 auto 5rem;
}
.topBtn a {
  display: block;
  width: 100%;
  max-width: 400px;
  background: rgba(255, 111, 128, 0.87);
  border-radius: 5rem;
  color: #fff;
  font-size: 1.6rem;
  text-indent: 2rem;
  text-align: center;
  padding: .5rem 0;
  margin: .5rem auto 2rem;
  outline: none;
  position: relative;
}
.topBtn a i {
  font-size: 1.5em;
  position: absolute;
  right: 2rem;
}
.topBtn a:hover {
  opacity: .8;
    -webkit-transition: 0.2s ease-in-out;
    -o-transition: 0.2s ease-in-out;
    transition: 0.2s ease-in-out;
}

/*////////////////////
    ARTICLE STYLE
////////////////////*/
.entry-header {
  font-weight: 600;
  margin: 0 auto 2rem; }
  .entry-header time {
    margin: 0;
    line-height: 1;
    font-size: 1.2rem;
    color: rgba(0, 0, 0, 0.54); }
    .entry-header time span {
      color: rgba(255, 84, 108, 0.54);
      margin: 0 .5rem 0 0; }
  .entry-header h1 {
    margin: 1.5rem 0;
    font-size: 2.8rem;
    line-height: 1.2; }
  .entry-header .share {
    margin: 2rem 0; }

.entry-content {
  font-size: 1.15em; }

.entry-content h2 {
  font-weight: 500;
  font-size: 2.4rem;
  line-height: 3.8rem;
  color: #000;
  margin: 4rem auto 2.5rem; }
  .entry-content h2 span {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(60%, transparent), color-stop(50%, rgba(255, 111, 128, 0.3)));
    background: -webkit-linear-gradient(transparent 60%, rgba(255, 111, 128, 0.3) 50%);
    background: -o-linear-gradient(transparent 60%, rgba(255, 111, 128, 0.3) 50%);
    background: linear-gradient(transparent 60%, rgba(255, 111, 128, 0.3) 50%); }

.entry-content h3 {
  margin: 4rem auto 2rem;
  font-size: 1.6rem;
  line-height: 1.2;
  color: #000; }
  .entry-content h3 i {
    color: rgba(255, 111, 128, 0.87);
    margin: 0 .5rem 0 0; }

.entry-content img {
  margin: 2rem auto;
  display: block; }

.entry-content p {
  margin: 2rem auto;
  line-height: 1.82; }

.entry-content ul, .entry-content ol {
  margin: 3rem 0;
  padding: 2rem 2rem 2rem 4rem;
  background: rgba(0, 0, 0, 0.02);
  border-radius: .5rem;
  color: #000; }
  .entry-content ul li, .entry-content ol li {
    list-style-type: disc;
    line-height: 1;
    margin: 0 0 1.8rem;
    line-height: 1.4;}
    .entry-content ul li:last-child, .entry-content ol li:last-child {
      margin: 0; }

.entry-content ol li {
  list-style-type: decimal; }

.entry-content a, .entry-content a:visited {
  color: rgba(255, 111, 128, 0.87);
  -webkit-transition: 0.2s ease-in-out;
  -o-transition: 0.2s ease-in-out;
  transition: 0.2s ease-in-out; }
  .entry-content a:hover, .entry-content a:focus, .entry-content a:visited:hover, .entry-content a:visited:focus {
    color: #ff546c;
    text-decoration: underline; }

.entry-content .contents-list {
  padding: 1rem;
  background: rgba(0, 0, 0, 0.05);}
  .entry-content .contents-list h3 {
    margin: 0 .5rem 1rem;
    font-weight: 600;}
  .entry-content .contents-list ul {
    background: rgba(255,255,255,1.00);
    margin: 0;
    padding: 2rem;}
    /*.entry-content .contents-list ul li {
      list-style: none;}*/
    .entry-content .contents-list ul li {
      list-style-type: none;
      text-indent: -1em;
      margin-left: 1em;}
    .entry-content .contents-list ul li:before {
      content: '';
      display: inline-block;
      width: 0;
      height: 0;
      margin: 0 .8rem 0 .2rem;
      border: transparent solid 5px;
      border-top-color: rgba(255, 111, 128, 0.3);
      vertical-align: -.1rem;}
  .entry-content .contents-list a {
    color: rgba(0, 0, 0, 0.87);
    text-decoration: none;
    -webkit-transition: 0.2s ease-in-out;
    -o-transition: 0.2s ease-in-out;
    transition: 0.2s ease-in-out;}
.entry-content .contents-list a:hover, .entry-content .contents-list a:focus, .entry-content .contents-list a:visited:hover, .entry-content .contents-list a:visited:focus {
    color: rgba(255, 111, 128, 0.87);
    text-decoration: underline; }

.entry-content .step {
  display: flex;
  justify-content: space-between;
  -webkit-justify-content: space-between;
}
  .entry-content .step > div {
    width: 200px;
  }
    .entry-content .step > div img {
      margin: 0 auto;
    }
    .entry-content .step > div p {
      margin: .5rem auto 2rem;
    }
    .entry-content .step > div .numberPC {
      margin: 0 auto;
      font-size: 1.3em;
      font-weight: bold;
      color: rgba(255, 111, 128, 0.5);
    }
    .entry-content .step > div .numberSP { display: none; }

#profile-post {
  border: 1px solid #7094b4;
  padding: 16px; }
  #profile-post img {
    float: left;
    margin: 0 16px 16px 0;
    max-width: 313px; }
  #profile-post > p:last-of-type {
    clear: both; }
  #profile-post > div {
    float: left;
    margin-right: 16px; }

.entry-content .summary {
  margin: 4rem 0;
  background: url("../images/top-bdr2.png"), rgba(0, 0, 0, 0.02);
  padding: 3rem 4rem;
  border-radius: .5rem;
  color: #000; }
  .entry-content .summary h3 {
    margin: 0 auto 2rem;
    text-align: center;
    font-size: 2.4rem;
    font-weight: 300;
    color: rgba(255, 111, 128, 0.87); }
  .entry-content .summary p {
    margin: 1.5rem 0; }
    .entry-content .summary p:last-child {
      margin: 1.5rem 0 0; }

.entry-footer {
  margin: 5rem 0 0;
  overflow: hidden; }
  .entry-footer > h4 ,
  .entry-footer > h1 {
    text-align: center;
    font-size: 1.8rem;
    line-height: 1;
    padding: 0 0 1rem;
    margin: 0 auto 1.5rem;
    font-weight: 300;
    border-bottom: 1px solid #ccc; }
  .entry-footer > h4 span ,
    .entry-footer > h1 span {
      color: rgba(255, 111, 128, 0.87);
      margin: 0 .5rem 0 0; }
  .entry-footer .article-list {
    display: flex;
    flex-wrap: wrap;
  }
  .entry-footer .article-list::after {
    display: block;
    content: "";
    clear: both;}
  .entry-footer .article-list article {
    width: 200px;
    margin: 0 30px 10px 0; }
    .entry-footer .article-list article:nth-child(3n) {
      margin: 0 0 10px 0; }
    .entry-footer .article-list article img {
      display: block; }
    .entry-footer .article-list article .txt {
      -webkit-transition: 0.2s ease-in-out;
      -o-transition: 0.2s ease-in-out;
      transition: 0.2s ease-in-out;
      padding: .5rem; }
    .entry-footer .article-list article a:hover .txt, .entry-footer .article-list article a:focus .txt {
      background: url("../images/top-bdr2.png"), rgba(0, 0, 0, 0.02); }
  .entry-footer .share {
    text-align: center;
    margin: 0 auto 3rem; }

.entry-footer > input[type="button"] {
  padding: .5rem 0;
  margin: .5rem auto 2rem;
  display: block;
  font-size: 1.6rem;
  text-align: center;
  background: #fff;
  border: 1px solid rgba(255, 111, 128, 0.87);
  border-radius: 5rem;
  color: rgba(255, 111, 128, 0.87);
  width: 100%;
  max-width: 400px;
  outline: none;
  }
.entry-footer > input[type="button"]:hover {
  opacity: .5;
    -webkit-transition: 0.2s ease-in-out;
    -o-transition: 0.2s ease-in-out;
    transition: 0.2s ease-in-out; }

/*////////////////////
    fixedArea STYLE
////////////////////*/
.pagetop  {
  position: fixed;
  bottom: 13rem;
  right: 2rem;
  font-size: 77%;}
  .pagetop a {
    display: block;
    width: 50px;
    height: 50px;
    background-color: #ccc;
    border-radius: .5rem;
    background-image: url(../images/ico-pagetop.png);
    background-repeat: no-repeat;
    background-position: 50% 50%;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    -webkit-transition: 0.2s ease-in-out;
    -o-transition: 0.2s ease-in-out;
    transition: 0.2s ease-in-out;}
    .pagetop a:hover {
      opacity: .5 ;}

.cvBtn {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  background-color: rgba(0,0,0,.2);
  z-index: 100;
  text-align: center;}
  .cvBtn ul {
    max-width: 940px;
    margin: 0 auto;
    padding: 1.5rem 1rem .5rem 2rem;}
  .cvBtn ul li {
    display: inline-block;
    padding-right: 1rem;
}
/* no.4517035 2025.08.20 ここから修正 */
@media only screen and (min-width: 769px) {
  .cvBtn ul li.firstTimeBtn {
    display: none;
  }
}
/* no.4517035 2025.08.20 ここまで修正 */

/*********************
LARGE VIEWING SIZE
*********************/
/*********************
DESKTOP
*********************/
/*********************
LARGER MOBILE DEVICES
*********************/
@media only screen and (max-width: 768px) {
  /*////////////////////
    GENERAL STYLE
////////////////////*/
  #wrapper {
    width: 86.6%;
    margin: 0 auto;
    padding: 2rem 0; }
  main {
    max-width: 100%;
    margin: 0;
    float: none; }
  aside {
    max-width: 100%; }
  /*////////////////////
    HEADER STYLE
////////////////////*/
  .site-header #site-title ,
  .site-header h1 {
    width: 82%; }
  .site-header #site-logo ,
  .site-header h2 {
    width: 46%; }
  .site-header .sns {
    display: none; }
  /*////////////////////
    FOOTER STYLE
////////////////////*/
  .site-footer .inner {
/* no.4517035 2025.08.20 ここから修正 */
    padding: 1rem 0 8rem;
  }
/* no.4517035 2025.08.20 ここまで修正 */
  /*////////////////////
    SIDE STYLE
////////////////////*/
  aside {
    border-top: 1px solid #ccc;
    margin: 3rem 0 0;
    padding: 3rem 0 0;
    float: none;}
    aside .bnr {
      margin: 0 auto 3rem; }
      aside .bnr img {
        width: 100%; }
  aside .poplur-article > input[type="button"] {
    padding: .5rem 0;
    margin: 0 0 1.5rem;}
  aside .poplur-article > input[type="button"]:hover {
    opacity: 1;}

  /*////////////////////
    COMMON STYLE
////////////////////*/
  .article-list article {
    margin: 0 auto 1.5rem; }
    .article-list article:last-child {
      margin: 0 auto; }
    .article-list article a {
      display: table;
      table-layout: fixed;
      width: 100%; }
    .article-list article .imgwrap, .article-list article .txt {
      display: table-cell;
      vertical-align: top; }
    .article-list article .txt {
      padding: 0 0 0 1rem; }
      .article-list article .txt h1 {
        margin: 0;
        font-size: 1.4rem; }
  /*////////////////////
    ARTICLE STYLE
////////////////////*/
  .entry-header h1 {
    margin: 1rem 0;
    font-size: 2rem; }
  .entry-content,
  .entry-content .contents-list a {
    font-weight: 300; }
  .entry-content h2 {
    font-size: 2rem; }
/*  .entry-content h3 {
    font-size: 1.4rem; }*/
    .entry-content .contents-list h3 {
      font-size: 1.6rem;
      font-weight: 600;}

    .entry-content .step {
        display: block;
        margin-top: .8rem;
    }
      .entry-content .step > div {
        width: 100%;
        margin-bottom: 20px;
      }
      .entry-content .step > div::after {
        display: block;
        height: 1px;
        content: "";
        background: #ccc;
        clear: both;
      }
      .entry-content .step > div:last-child::after {
        display: block;
        height: 0;
        content: "";
      }
        .entry-content .step > div img {
          float: left;
          width: 35%;
          padding-right: 1rem;
          padding-bottom: 20px;
        }
        .entry-content .step > div p {
          float: right;
          width: 65%;
          margin: 0 auto;
          padding-left: 2rem;
          padding-bottom: 20px;
          text-indent: -2.8rem;
        }
        .entry-content .step > div .numberSP {
          display: inline;
          margin: 0 auto;
          padding: 0 1rem;
          font-size: 1.7rem;
          font-weight: bold;
          color: rgba(255, 111, 128, 0.5);
        }
        .entry-content .step > div .numberPC { display: none; }


    #profile-post img {
      float: none;
      margin: 0 16px 0 0;
      width: 100%; }
    #profile-post > div {
      float: none;
      margin-right: 0; }

  .entry-content .summary h3 {
    font-size: 1.8rem; }
  .entry-footer .article-list article {
    width: 100%;
    float: none;
    margin: 0 auto 1.5rem; }
    .entry-footer .article-list article:last-child {
      margin: 0 auto; }
  .entry-footer .share {
    text-align: left; }
  .entry-footer > input[type="button"] {
    margin: 2rem 0 0;}
  .entry-footer > input[type="button"]:hover {
    opacity: 1;}

  .entry-content ul li{
    line-height: 1.5;}

  /*////////////////////
    fixedArea STYLE
////////////////////*/
/* no.4517035 2025.08.20 ここから修正 */
  .pagetop {
    bottom: 8.5rem;
    right: 1rem;
  }

  .cvBtn ul {
    padding: 1rem 1.5rem;
    overflow: hidden;}
  .cvBtn ul li {
    padding: 0;
    width: 50%;
    float: left;
  }
  .cvBtn ul li.pcOnly {
    display: none;
  }
  .cvBtn ul li.firstTimeBtn {
    width: 100%;
    float: none;
  }
  .cvBtn ul li.firstTimeBtn a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    background: #fff;
    border: 1px solid #ff8e06;
    border-radius: 5rem;
    color: #ff8e06;
    font-size: 1.6rem;
    padding: 1.2rem 0;
    position: relative;
  }
  .cvBtn ul li.firstTimeBtn a i {
    position: absolute;
    right: 2rem;
  }
}
/* no.4517035 2025.08.20 ここまで修正 */
/*********************
RETINA (2x RESOLUTION DEVICES)
*********************/
/*********************
PRINT STYLESHEET
*********************/
@media print {
  * {
    background: transparent !important;
    color: black !important;
    text-shadow: none !important;
    -webkit-filter: none !important;
            filter: none !important;
    -ms-filter: none !important; }
  a, a:visited {
    color: #444 !important;
    text-decoration: underline; }
    a:after, a:visited:after {
      content: " (" attr(href) ")"; }
    a abbr[title]:after, a:visited abbr[title]:after {
      content: " (" attr(title) ")"; }
  .ir a:after,
  a[href^="javascript:"]:after,
  a[href^="#"]:after {
    content: ""; }
  pre, blockquote {
    border: 1px solid #999;
    page-break-inside: avoid; }
  thead {
    display: table-header-group; }
  tr, img {
    page-break-inside: avoid; }
  img {
    max-width: 100% !important; }
  @page {
    margin: 0.5cm; }
  p, h2, h3 {
    orphans: 3;
    widows: 3; }
  h2,
  h3 {
    page-break-after: avoid; }
  .sidebar,
  .page-navigation,
  .wp-prev-next,
  .respond-form,
  nav {
    display: none; } }