/*
Theme Name: delfonics
Author: kazuki takahashi
Description: delfonics CMS theme
Version: 1
*/


@import "https://shop.delfonics.com/shop/css/r_system_preset.css";
@import "https://shop.delfonics.com/shop/item/delfonics/design/template01/css/system_DesignSettings.css";
@import "https://shop.delfonics.com/shop/item/delfonics/design/template01/css/system_SizeColorSettings.css";
@import "https://shop.delfonics.com/shop/item/delfonics/design/template01/css/system_LayoutSettings.css";
/**/
@import "https://shop.delfonics.com/common/css/reset.css";
@import "https://shop.delfonics.com/common/css/common.css";
@import "https://shop.delfonics.com/common/css/special.css";
@import "https://shop.delfonics.com/common/css/hello.css";
@import "https://shop.delfonics.com/common/css/slick.css";
@import "https://shop.delfonics.com/common/css/jquery.fancybox.css";
@import "https://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css";


/**/
img {
  vertical-align: top;
}
.blog-header__inner {
  position: relative;
  width: 955px;
  margin: 0 auto;
  padding: 0 0 26px 0;
  color: #2d2d2d;
  border-bottom: 1px solid #5a5a5a;
}
.sptemp-wrapper .article-type01__btn a {
  text-decoration: none;
}
@media screen and (max-width: 767px) {
  .echeader {
    height: 54px;
  }
  .blog-wrapper {
    margin: 0;
  }
  .blog-header__inner {
    border: none;
    padding: 0;
  }
}

/* 特集タイトル */
.featureHeader {
  width: 955px;
  margin: 45px auto 0 auto;
  border-bottom: 1px solid #5a5a5a;
  padding: 0 0 25px 0;
  text-align: left;
}
.featureHeader_Title {
  font-weight: 300;
  font-size: 45px;
  font-family: "pragmatica", sans-serif;
  margin: 0 0 5px 0;
  padding: 0;
  color: #2d2d2d;
}
.featureHeader_Title--archive {
  font-size: 35px;
  padding: 3px 0 0 0;
}
.featureHeader_Txt {
  margin: 10px 0 0 0;
  padding: 0;
  font-size: 116%;
  line-height: 1.1;
  margin: 0;
  padding: 0;
  color: #2d2d2d;
}
@media screen and (max-width: 767px) {
  .featureHeader {
    width: auto;
    margin: 0;
    border-bottom: none;
    padding: 12px 20px;
    background: #eee;
  }
  .featureHeader_Title {
    font-size: 16px;
    line-height: 1.3;
    margin: 0;
  }
  .featureHeader_Txt {
    margin: 0;
    font-size: 10px;
    line-height: 1.3;
  }
}


/* 特集一覧 */
.featurelist {
  display: flex;
  flex-wrap: wrap;
  margin: 40px -20px 50px -20px;
}
.featurelist_Item {
  width: 20%;
  margin: 0 0 20px 0;
}
.featurelist_Item a {
  display: block;
  transition: opacity .2s;
}
.featurelist_Item a:hover {
  opacity: .7;
}
.featurelist_Item a em {
  width: 157px;
  height: 157px;
  border-radius: 8px;
  overflow: hidden;
  display: block;
  margin: 0 auto;
}
.featurelist_Item a span {
  display: block;
  margin: 12px 20px 0 20px;
}
@media screen and (max-width: 767px) {
  .featurelist {
    margin: 20px;
  }
  .featurelist_Item {
    width: 31%;
    margin: 0 0 10px 0;
  }
  .featurelist_Item:nth-child(3n-1) {
    margin: 0 3.5% 10px 3.5%;
  }
  .featurelist_Item a:hover {
    opacity: 1;
  }
  .featurelist_Item a em {
    width: 100%;
    height: auto;
  }
  .featurelist_Item a img {
    width: 100%;
    height: auto;
  }
  .featurelist_Item a span {
    margin: 7px 0;
    font-size: 11px;
  }
}


/* 特集記事 */


.system_content--feature-entry .blog-h3 {
  font-size: 16px;
  font-weight: bold;
  padding: 30px 0 10px 0;
}

.system_content--feature-entry {
  width: 100%;
}
.system_content--feature-entry .blog-wrapper {
  margin: -10px 0 -25px 0;
}
.system_content--feature-entry .blog-header {
  margin: 0 0 50px 0;
}
.cms-wrapper {
  width: 600px;
  margin: 0 auto;
  position: relative;
}
@media screen and (max-width: 767px) {
  .system_content--feature-entry .blog-wrapper {
    margin: 0;
  }
  .system_content--feature-entry .blog-header {
    margin: 0 0 30px 0;
  }
  .system_content--feature-entry .blog-series {
    padding: 30px 0;
  }
  .cms-wrapper {
    flex-direction: column;
    width: auto;
    margin: 0;
  }
}

/* 特集記事 ナビ */
.cms-nav ul {
  display: flex;
  margin: 0;
  padding: 0;
}
.cms-nav ul li {
  margin: 0;
  padding: 50px 0;
  list-style: none;
  width: 180px;
}
.cms-nav ul li:nth-child(2) {
  margin: 0 40px;
}
.cms-nav ul li a {
  display: block;
  transition: opacity .2s;
}
.cms-nav ul li a:hover {
  opacity: .7;
}
.cms-nav ul li img {
  width: 100%;
  height: auto;
  margin: 0 20px 0 0;
  border-radius: 4px;
}
.cms-nav ul li strong {
  font-size: 11px;
  font-weight: normal;
  display: block;
  line-height: 1.5;
  padding: 5px 0 0 0;
}
.cms-nav ul li em {
  padding: 15px 0 0 0;
  font-size: 13px;
  font-weight: normal;
  display: block;
  font-style: normal;
  line-height: 1.3;
}
@media screen and (max-width: 767px) {
  .cms-nav {
    width: 100%;
    min-width: inherit;
    position: relative;
    top: inherit;
    padding: 0 20px;
    border-top: 1px solid #ddd;
    box-sizing: border-box;
    margin-bottom: -1px;
  }
  .cms-nav ul li {
    width: 30%;
    padding: 30px 0;
  }
  .cms-nav ul li:nth-child(2) {
    margin: 0 20px;
  }
  .cms-nav ul li em {
    font-size: 11px;
  }
}


/* 特集記事 記事 */
.cms-article {
  width: 600px;
  padding: 50px 0 20px 0;
  color: #000;
}
.cms-article_header {
  font-size: 25px;
  font-weight: bold;
  margin: 0 0 10px 0;
  padding: 0;
  line-height: 1.4;
}
.cms-article_header small {
  display: block;
  font-weight: normal;
  font-size: 14px;
  margin: 0 0 5px 0;
}
.cms-article p {
  font-size: 14px;
  line-height: 2;
  margin: 0 0 20px 0;
  padding: 0;
}
.cms-article p a {
  text-decoration: underline;
}
.cms-article p a:hover {
  text-decoration: none;
}
.cms-article p img {
  margin: 20px 0;
}
.cms-article p:first-of-type img {
  margin: 0 0 20px 0;
}
.cms-article img {
  max-width: 100%;
  height: auto;
}
@media screen and (max-width: 767px) {
  .cms-article {
    width: auto;
    padding: 30px 20px 10px 20px;
  }
  .cms-article_header {
    font-size: 16px;
    margin: 0 0 5px 0;
  }
  .cms-article_header small {
    font-size: 12px;
  }
  .cms-article p {
    font-size: 13px;
    margin: 0 0 10px 0;
  }
  .cms-article p img {
    margin: 15px 0;
  }
  .cms-article p:first-of-type img {
    margin: 0 0 15px 0;
  }
  .cms-article p br {
    display: none;
  }
}

/* no-header */
html.no-header {
  background: #fff;
}
html.no-header body {
  background: #fff;
  text-align: left;
}
html.no-header .footer {
  text-align: center;
  padding: 30px 0 50px 0;
}
html.no-header .footer__links {
  margin: 0 0 10px 0;
}
html.no-header .footer__links ul {
  margin: 0 0 20px 0;
  padding: 0;
}
html.no-header .footer__links ul li {
  margin: 0 10px;
  padding: 0;
  display: inline-block;
  list-style: none;
  font-size: 14px;
  font-family: "pragmatica";
  font-weight: 400;
  vertical-align: middle;
}
html.no-header .footer__links ul li:first-child {
  border-right: 1px solid #000;
  padding: 0 23px 0 0;
}
html.no-header .footer__links ul li a {
  text-decoration: none;
  color: #000;
}
html.no-header .footer__links ul li a:hover {
  text-decoration: underline;
  color: #000;
}
html.no-header .footer__links .footer__copyright small {
  font-size: 11px;
  font-family: "pragmatica";
}
@media screen and (max-width: 767px) {
  html.no-header .footer {
    padding: 20px 0 30px 0;
  }
  html.no-header .footer__links ul {
    margin: 0 0 10px 0;
  }
  html.no-header .footer__links ul li {
    font-size: 12px;
    margin: 0 5px;
  }
  html.no-header .footer__links ul li:first-child {
    padding: 0 15px 0 0;
  }
}


/* entry-list */
.entry-list {
  margin: 0 auto 80px auto;
  width: 890px;
}
.entry-list li {
  margin: 0 0 60px 0;
  padding: 0;
  list-style: none;
}
.entry-list li:last-child {
  margin: 0;
}
.entry-list li a {
  display: flex;
  text-decoration: none;
  color: #3C3C41;
}
.entry-list li a:hover strong {
  text-decoration: underline;
}
.entry-list li a img {
  margin: 0 30px 0 0;
  min-width: 280px;
  width: 280px;
  height: 280px;
}
.entry-list li a span em {
  display: block;
  margin: 0 0 10px 0;
  font-size: 16px;
  font-style: normal;
}
.entry-list li a span strong {
  display: block;
  margin: 0 0 30px 0;
  font-size: 20px;
  font-weight: bold;
  line-height: 1.5;
}
.entry-list li a span small {
  display: block;
  margin: 0 0 10px 0;
  font-size: 16px;
  line-height: 1.8;
}
@media screen and (max-width: 767px) {
  .entry-list {
    margin: 0 20px 40px 20px;
    width: auto;
  }
  .entry-list li {
    margin: 0 0 20px 0;
  }
  .entry-list li:last-child {
    margin: 0;
  }
  .entry-list li a:hover strong {
    text-decoration: none;
  }
  .entry-list li a img {
    margin: 0 20px 0 0;
    min-width: 100px;
    width: 100px;
    height: 100px;
  }
  .entry-list li a span em {
    font-size: 12px;
  }
  .entry-list li a span strong {
    font-size: 12px;
    margin-bottom: 15px;
  }
  .entry-list li a span small {
    display: none;
  }
}


/* archives */
.archives {
  width: 960px;
  margin: 0 auto 80px auto;
}
.archive-entry {
  width: 600px;
  margin: 50px auto 0 auto;
}
.archive-entry a {
  display: flex;
  color: #5a5a5a;
}
.archive-entry a:hover {
  color: #5a5a5a;
}
.archive-entry a:hover span strong {
  text-decoration: underline;
}
.archive-entry em {
  margin: 0 30px 0 0;
}
.archive-entry em img {
  border-radius: 8px;
  width: 160px;
  height: auto;
}
.archive-entry span strong {
  display: block;
  font-size: 16px;
  margin-bottom: 15px;
  font-weight: normal;
  line-height: 1.5;
}
.archive-entry span small {
  display: block;
  font-size: 13px;
  line-height: 1.5;
  margin-bottom: 15px;
}
@media screen and (max-width: 767px) {
  .archives {
    width: auto;
    margin: 0 20px 40px 20px;
  }
  .archive-entry {
    width: auto;
    margin: 20px auto 0 auto;
  }
  .archive-entry em {
    margin: 0 15px 0 0;
  }
  .archive-entry em img {
    width: 80px;
    height: auto;
  }
  .archive-entry span strong {
    font-size: 13px;
    margin-bottom: 10px
  }
  .archive-entry span small {
    font-size: 11px;
    margin-bottom: 10px
  }
  .archive-entry span strong + small {
    display: none;
  }
}


/* archives-pager */
.archives-pager {
  text-align: center;
  margin: 0 0 80px 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.archives-pager .page-numbers {
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #ddd;
  margin: 0 3px;
  border-radius: 4px;
}
.archives-pager span.page-numbers {
  background: #eee;
}
.archives-pager .page-numbers.prev,
.archives-pager .page-numbers.next {
  width: auto;
  border: none;
  margin: 0 10px;
}

/* -- pc,sp出し分けスタイル20190422追記 -- */
@media screen and (min-width: 768px) {
  .pc-hide {
    display: none !important;
  }
}
@media screen and (max-width: 767px) {
  .sp-hide {
    display: none !important;
  }
}
/* -- パンくず20190422追記 -- */
.FS2_breadcrumbs-wrap br {
  display: none;
}

/* -- ペンの贈り物記事20190422追記 -- */
.ttl-img {
  margin-top: 40px;
}
@media screen and (max-width: 767px) {
  .ttl-img {
    margin-top: 20px;
    padding: 0 20px;
  }
}
.ttl-img img {
  max-width: 100%;
  width: auto;
  height: auto;
  vertical-align: bottom;
}
.product-p {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 75px;
  margin-bottom: 40px;
  padding: 15px 30px 15px 20px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  background-repeat: no-repeat;
  -webkit-background-size: 600.5px 150.5px;
  background-size: 600.5px 150.5px;
  background-image: url(/wp-content/uploads/2019/04/frame1201x301.png);
}
@media screen and (max-width: 767px) {
  .product-p {
    display: block;
    margin-top: 37px;
    margin-bottom: 20px;
    padding: 10px 10px 30px 10px;
    -webkit-background-size: 100% 100%;
    background-size: 100% 100%;
    background-image: url(/wp/wp-content/uploads/2019/04/frame3001x1461.png);
  }
}
.product-p__inner {

}
.cms-article p.product-p__lead {
  line-height: 1.6;
  letter-spacing: 0.08em;
  font-weight: bold;
  font-size: 16px;
}
@media screen and (max-width: 767px) {
  .cms-article p.product-p__lead {
    text-align: center;
  }
}
@media screen and (max-width: 767px) {
  .cms-article p.product-p__lead br {
    display: block;
  }
}
.cms-article p.product-p__txt {
  margin-top: 30px;
  line-height: 1.3;
  font-size: 13px;
}
@media screen and (max-width: 767px) {
  .cms-article p.product-p__txt {
    text-align: center;
    margin-top: 15px;
    line-height: 1.5;
    font-size: 12px;
  }
}
@media screen and (max-width: 767px) {
  .cms-article p.product-p__txt br {
    display: block;
  }
}
.product-p__img {
  width: 246px;
}
@media screen and (max-width: 767px) {
  .product-p__img {
    width: 85%;
    margin-top: 20px;
    margin-left: auto;
    margin-right: auto;
  }
}

/* -- 手帳特集（インキャリ流用）テンプレ追加20191003記 -- */


/* innercarryingpc */
.sptemp-read__title--innercarryingpc-1,
.sptemp-read__title--innercarryingpc-2,
.sptemp-read__title--innercarryingpc-3,
.sptemp-read__title--innercarryingpc-4 {
  margin: 0 0 30px 0;
}
.sptemp-read__title--innercarryingpc-1 img,
.sptemp-read__title--innercarryingpc-2 img,
.sptemp-read__title--innercarryingpc-3 img,
.sptemp-read__title--innercarryingpc-4 img {
  display: block;
}
.sptemp-read__title--innercarryingpc-1 small,
.sptemp-read__title--innercarryingpc-2 small,
.sptemp-read__title--innercarryingpc-3 small,
.sptemp-read__title--innercarryingpc-4 small {
  font-size: 25px;
}
.sptemp-read__title--innercarryingpc-1 img {
  margin: 0 auto 10px auto;  
}
.sptemp-read__title--innercarryingpc-2 img {
  margin: 0 auto 20px auto;  
}
.sptemp-read__title--innercarryingpc-3 img {
  margin: 0 auto 20px auto;  
}
.sptemp-read__title--innercarryingpc-4 img {
  margin: 0 auto 20px auto;  
}
@media screen and (max-width: 767px) {
  .sptemp-read {
    margin: 0 15px 30px 0;
    padding: 20px 0 0 20px;
    box-sizing: border-box;
  }
  .sptemp-read--mb40-30 {
    margin-bottom: 30px;
  }
  .sptemp-read--mb50-30 {
    margin-bottom: 30px;
  }
  .sptemp-read.sptemp-read--mb80-50 {
    margin: 0 0 50px 0;
  }
  .sptemp-read.sptemp-read--mb20-20 {
    margin: 0 0 20px 0;
  }
  .sptemp-read__title {
    font-size: 20px;
  }
  .sptemp-read__title small {
    font-size: 13px;
  }
  .sptemp-read__txt p {
    font-size: 13px;
    text-align: left;
  }
  .sptemp-read__txt strong {
    font-size: 13px;
  }
  .sptemp-center__txt p {
    font-size: 13px;
    text-align: left;
  }

  .sptemp-read__txt p br {
    display: none;
  }
  
  /* innercarryingpc */
  .sptemp-read__title--innercarryingpc-1 {
    margin: 0 0 20px 0;
  }
  .sptemp-read__title--innercarryingpc-2,
  .sptemp-read__title--innercarryingpc-3,
  .sptemp-read__title--innercarryingpc-4 {
    margin: 0 0 15px 0;
  }
  .sptemp-read__title--innercarryingpc-1 small,
  .sptemp-read__title--innercarryingpc-2 small,
  .sptemp-read__title--innercarryingpc-3 small,
  .sptemp-read__title--innercarryingpc-4 small {
    font-size: 16px;
  }
  .sptemp-read__title--innercarryingpc-1 img {
    width: 280px;
    height: auto;
  }
  .sptemp-read__title--innercarryingpc-2 img {
    width: 200px;
    height: auto;
    margin: 0 auto 10px auto;  
  }
  .sptemp-read__title--innercarryingpc-3 img {
    width: 200px;
    height: auto;
    margin: 0 auto 10px auto;  
  }
  .sptemp-read__title--innercarryingpc-4 img {
    width: 200px;
    height: auto;
    margin: 0 auto 10px auto;  
  }  
}