/*
Theme Name: affinger-child
Template: affinger
Description: AFFINGER6 対応
Version: 20240601
*/

/*media Queries PC
---------------------------------------------------------------------------------------------------*/
@media print, screen and (min-width: 770px) {
  html, body {
    color: #333333;
    margin: auto;
    font-family: メイリオ, Meiryo, "ＭＳ Ｐゴシック", "MSPGothic", Helvetica, sans-serif, Osaka;
    font-size: 14px;
    line-height: 1.6;
  }
  body:not(.front-page) main {
      border: none !important;
      width: 820px;
      margin-left: 300px;
      padding: 10px 0 30px;
  }
  .sp_item {
    display: none;
  }
  .pc_item {
    display: block;
  }
  .f_gothic {
    font-family:
    "A-OTF UD Shin Go Pro",
    "UD Shin Go Pro",
    "UD新ゴ Pro",
    "Noto Sans JP",
    -apple-system,
    system-ui,
    BlinkMacSystemFont,
    "Hiragino Sans",
    "Hiragino Kaku Gothic ProN",
    "Yu Gothic Medium",
    "Yu Gothic",
    "Meiryo",
    "Segoe UI",
    Roboto,
    "Helvetica Neue",
    Arial,
    sans-serif;
  }
  h1 {
    font-size: 15pt;
  }
  h2,
  h2 a {
    font-size: 14pt;
    font-weight: 700;
    line-height: 1.6;
    color: #333333;
  }
  h3 {
    font-size: 12pt;
  }
  /*　カテゴリ名タグ表示　 */
  .catname {
    font-weight: 700;
  }
  .st-catgroup.itiran-category .catname {
    font-size: 13px !important;
    margin: 0 0 5px;
  }
   /*　日付・更新日　 */
  .kdate .st-svg-refresh::before {
    display: none;
  }
  .kanren:not(.st-cardbox) .clearfix dd .blog_info p  {
    color: #333333;
    font-size: 14px !important;
  }
  .kanren:not(.st-cardbox) .clearfix dd .blog_info p i {
    display: none;
  }
  .blogbox p {
    font-size: 14px !important;
  }
  #headbox {
    display: none !important;
  }
  .cpn-portal_nav {
    display: none;
    position: absolute;
    top: 35px;
    left: 0;
    border: 1px solid #333333;
    border-top: none;
    background: #FFFFFF;
    width: 1120px;
    z-index: 1;
    box-sizing: border-box;
  }
  .cpn-portal_nav__title {
    background: #87B828;
    color: #FFFFFF;
    font-size: 15px;
    font-weight: bold;
    text-align: left;
    padding: 0 0 0 20px;
    border: 1px solid #333333;
    border-left: none;
    width: 1120px;
    height: 30px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-bottom: 0;
  }
  .cpn-portal_nav__subtitle {
    background: #FFFDF3;
    text-align: left;
    padding: 4px 0 2px 20px;
    border-top: 1px solid #333333;
    border-bottom: 1px solid #333333;
    border-right: 1px solid #333333;
    width: 1120px;
    box-sizing: border-box;
    margin-bottom: 0;
  }
  .cpn-portal_nav__body {
    border-collapse: collapse;
    background: #FFFFFF;
    margin-bottom: 0;
  }
  .cpn-portal_nav__item {
    width: 224px;
    height: 60px;
    background: #FFFFFF;
    border-right: 1px solid #333333;
    padding: 0;
  }
  .cpn-portal_nav__item:nth-child(5) {
    border-right: none;
    width: 223px;
  }
  .under_line {
    border-bottom: 1px solid #333333;
  }
  .cpn-portal_nav__item a {
    position: relative;
    width: 100%;
    padding: 0 0 0 20px;
    height: 100%;
    box-sizing: border-box;
    color: #333333;
    font-size: 15px;
    display: flex;
    align-items: center;
    line-height: 1.4;
    text-align: left;
  }
  .cpn-portal_nav__item a:hover {
    opacity: 0.5;
    cursor: pointer;
    color: #333333;
  }
  .cpn-portal_nav__item a span {
    position: absolute;
    top: 22px;
    right: 17px;
    font-size: 0;
  }
  .cpn-portal_nav__item a .maker {
    width: 80px;
    margin-right: 10px;
  }
  .gnav_wrapper .gnav_mitsumori {
    display: flex;
    gap: 0 8px;
    align-items: center;
    justify-content: left;
    background: #FFFFFF;
    color: #333333;
    font-size: 15px;
    font-weight: normal;
    width: 220px;
    border: 1px solid #333333;
    border-radius: 100px;
    line-height: 1;
    padding-left: 12px;
    box-sizing: border-box;
    margin-left: auto;
  }
}
@media print, screen and (min-width: 600px) {

}

/*media Queries スマホサイズ（599px）以下で適応したいCSS - スマホのみ
---------------------------------------------------------------------------------------------------*/
@media print, screen and (max-width: 769px) {
  .sp_item {
    display: block;
  }
  .pc_item {
    display: none;
  }
  img {
    max-width: 100%;
  }
  html, body {
    font-family: メイリオ, Meiryo, "ＭＳ Ｐゴシック", "MSPGothic", Helvetica, sans-serif, Osaka;
    font-size: 3.73vw;
  }
  .entry-content h1,
  .entry-title h1 {
    font-size: 5.3vw;
    line-height: 1.6;
  }
  h2,
  h2 a {
    font-size: 5vw !important;
    line-height: 1.6;
  }
  .entry-content h3 {
    font-size: 4.3vw;
  }
   /*　日付・更新日　 */
  .kdate .st-svg-refresh::before {
    display: none;
  }
  .kanren:not(.st-cardbox) .clearfix dd .blog_info p  {
    color: #333333;
    font-size: 3vw !important;
  }
  .kanren:not(.st-cardbox) .clearfix dd .blog_info p i {
    display: none;
  }
  .cpn-portal_nav {
    display: none;
    position: absolute;
    top: 11vw;
    margin: 0 calc(50% - 50vw);
    width: 100vw;
    border: 1px solid #333333;
    border-top: none;
    background: #FFFFFF;
    z-index: 1;
    box-sizing: border-box;
  }
  .cpn-portal_nav__title {
    background: #87B828;
    color: #FFFFFF;
    font-weight: bold;
    text-align: left;
    border: 1px solid #333333;
    border-left: none;
    border-right: none;
    width: 100%;
    height: 10.66vw;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    font-size: 5.33vw;
    padding: 0 0 0 2%;
    margin-bottom: 0;
  }
  .cpn-portal_nav__subtitle {
    background: #FFFDF3;
    text-align: left;
    padding: 0 0 0 2.66vw;
    border-top: 1px solid #333333;
    border-bottom: 1px solid #333333;
    border-right: 0;
    width: 100%;
    height: 10.66vw;
    box-sizing: border-box;
    margin-bottom: 0;
    display: flex;
    align-items: center;
    font-size: 3.73vw;
    position: relative;
    font-weight: 400;
  }
  .cpn-portal_nav__subtitle::after {
    content: "＋";
    position: absolute;
    right: 3%;
    top: 50%;
    transform: translateY(-50%);
    font-size: 18px;
    line-height: 1;
  }
  .cpn-portal_nav__subtitle.is-active::after {
    content: "ー";
  }
  .cpn-portal_nav__body {
    border-collapse: collapse;
    background: #FFFFFF;
    display: none;
  }
  .cpn-portal_nav__body.is-open {
    display: table;
    margin-bottom: 0;
  }
  .cpn-portal_nav__item {
    width: 49.86vw;
    height: 13.33vw;
    background: #FFFFFF;
    border-right: 1px solid #333333;
    padding: 0;
  }
  .cpn-portal_nav__item:nth-child(5) {
    width: 49.86vw;
  }
  .under_line {
    border-bottom: 1px solid #333333;
  }
  .cpn-portal_nav__item a {
    position: relative;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    color: #333333;
    display: flex;
    align-items: center;
    padding: 0 5% 0 5%;
    font-size: 3.73vw;
    line-height: 1.2;
    text-align: left;
    text-decoration: none;
  }
  .cpn-portal_nav__item a:hover {
    opacity: 0.5;
    cursor: pointer;
  }
  .cpn-portal_nav__item a span {
    position: absolute;
    top: 37%;
    right: 6%;
    font-size: 0;
    width: 2vw;
  }
  .cpn-portal_nav__item a .maker {
    width: 80px;
    margin-right: 10px;
  }
  .cpn-product_nav_lists {
    display: inline-flex;
    flex-wrap: wrap;
    width: 94.66vw;
    gap: 2vw;
    margin: 5vw auto;
    padding-left: 4vw;
  }
  .cpn-product_nav.open {
    padding-bottom: 14vw;
  }
  .cpn-product_nav.open .cpn-product_nav_listwrap {
    max-height: 200vw;
  }
  .cpn-product_nav_item {
    text-align: center;
    width: 21.33vw;
    height: 25.33vw;
    font-size: 0;
  }
  .cpn-product_nav_item>a {
    width: 21.33vw;
    display: block;
    text-decoration: none;
  }
  .cpn-product_nav_item>a>img {
    width: 100%;
  }
  .cpn-product_nav_item>a .cpn-product_nav_text {
    font-size: 2.6vw;
    text-align: left;
    line-height: 1.0;
    margin-top: 1.5vw;
    color: #333333;
  }
  .cpn-product_nav_listwrap {
    position: relative;
    overflow: hidden;
    max-height: 50vw;
    transition: max-height .3s ease;
  }
  .cpn-product_nav_toggle {
    position: absolute;
    background: transparent;
    border: none;
    bottom: 4vw;
    left: 50%;
    transform: translateX(-50%);
    font-size: 4vw;
  }
  .cpn-product_nav.open .cpn-product_nav_toggle {
    bottom: 2vw;
    left: 2vw;
    padding: 3% 5%;
    margin-bottom: 2vw;
    transform: translateX(0);
    font-size: 3.73vw;
    background: #fff;
    border-radius: 999px;
    border: 1px solid #ccc;
  }
  /* グラデーション透過 */
  .cpn-product_nav_fade {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 16vw;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0), #fff);
    pointer-events: none;
    transition: opacity .3s ease;
  }
  .cpn-product_nav.open .cpn-product_nav_fade {
    display: none;
  }
}