@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/* @import url('https://fonts.googleapis.com/css2?family=M+PLUS+1p:wght@400;500;600;700;800&display=swap'); */

@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700;900&display=swap');


/*ダークモード設定*/

:root, html {
  --theme-color:#FFFFFF;
  --icon:#aeab92;
  --icon-rgb:174, 171, 146;
  --text-main:#444;
  --text-sub:#777;

  --text-link: #498ee0;
  --text-keycolor2: #642b14;
  --text-keycolor3: #242529;
  --text-subcolor2: #815c38;
  --text-heading:#e70e56;
  --text-sub-heading:#ff4f80;
  --text-placeholder:#aeab92;

  --text-pink-sub:#fdf2f2;

  --key-color1:#48c8ef;
  --key-color2:#e70e56;
  --key-color3:#498ee0;
  --key-color-pink:#ff4f80;

  --male-color: #4a90e2;
  --female-color: #e94e77;
  --male-percent: 50%;

  --alert-box-bg:#fdf2f2;
  --text-alart-box: #444;
  --text-alart-heading:#ff4f80;

  --btn-color-red:#ff4f80;
  --btn-color-red-shadow:#e70e56;
  
  --btn-color-blue:#48c8ef;
  --btn-color-blue-shadow:#498ee0;


  --app-bg-paters:#74c9b8;
  --app-bg-paters-rgb:116, 201, 184;
  --app-bg-lovean:#fe28ba;
  --app-bg-lovean-rgb: 254, 40, 186;
  --app-bg-paddy:#59c9fc;
  --app-bg-paddy-rgb:89, 201, 252;
  --app-bg-patrona:#00a7d9;
  --app-bg-patrona-rgb:0, 167, 217;

  --app-bg-ikukuru:#00cdd0;
  --app-bg-ikukuru-rgb:0, 205, 208;

  --app-bg-pappy:#5cc8ca;
  --app-bg-pappy-rgb:92, 200, 202;
  --app-bg-sugardaddy:#e30334;
  --app-bg-sugardaddy-rgb:227, 3, 52;
  --app-bg-wakuwaku:#fd62ab;
  --app-bg-wakuwaku-rgb:253, 98, 171;

  --app-bg-pato:#e17d49;
  --app-bg-pato-rgb:225, 125, 73;

  --app-bg-patolo:#FFF;
  --app-bg-patolo-rgb:255, 255, 255;

  --app-bg-jmail:#fb5d7a;
  --app-bg-jmail-rgb:251, 93, 122;
  --app-bg-pj88:#e24586;
  --app-bg-pj88-rgb:224, 71, 134;



  --label-bg-shadow:#fffad8;
  --label-bg-shadow-rgb:255, 250, 216;
  --bg-table-th:#def5fc;
  --bg-table-odd:#f6f8fe;

/* --bg7:#edf2f7; */
  --bg7:#f5f4f1;
  --bg6:#fff5b1;
  --bg5:#efdef8;
  --bg4:rgb(244, 244, 244);
  --bg3:#fff ;
  --bg2:#ffffff ;
  --bg1:#ebebeb ;
  --bg1-on:#f0f8ffea;
  --underline-blue:#a8dafb;
  --underline-red:#ffd0d1;
  --underline: #ff9;
  --y-100: #fdf6ed;
  
  font-feature-settings: "halt";

  /* --font-sans: Helvetica Neue, Arial, Hiragino Sans, Hiragino Kaku Gothic ProN, BIZ UDPGothic, Meiryo, sans-serif; */

  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica Neue, Arial, Meiryo, sans-serif;



  --font-mono: SFMono-Regular, Menlo, Consolas, Bitstream Vera Sans Mono, Courier New, Courier, BIZ UDGothic, Meiryo, monospace;

  /* --font-bold: "SF Pro Text", "SF Pro Icons", "BIZ UDPGothic", Meiryo, "Helvetica Neue", Arial, "Hiragino Sans", "Hiragino Kaku Gothic ProN", sans-serif; */

  --font-bold: "BIZ UDPGothic", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica Neue, Arial, Meiryo, sans-serif;


}

/* PCの設定でダークモードを選択した場合のスタイリング */

html.Dark, .dark,[data-theme=dark] {

  --theme-color:#1c1a1a;
  --icon:#999;
  --icon-rgb:66, 80, 94;
  --text-main: #faf8f7;
  --text-sub:#999;
  --text-link: #faf8f7;

--text-keycolor2: #faf8f7;
--text-keycolor3: #242529;
--text-subcolor2: #815c38;
--text-heading:#faf8f7;
--text-sub-heading:#faf8f7;

--text-pink-sub:#ff4f80;

--key-color1:#498ee0;
--key-color2:#e70e56;
--key-color3:#601fa5;
--key-color4:#e70e56;

--alert-box-bg:#3a4045;
--text-alart-box: #faf8f7;
--text-alart-heading:#ff4f80;

--btn-color-red:#ff4f80;
--btn-color-red-shadow:#e70e56;

--btn-color-blue:#498ee0;
--btn-color-blue-shadow:#315d92;
--label-bg-shadow:#3d4446;
--label-bg-shadow-rgb:61, 68, 70;
--bg-table-th:#42505e;
--bg-table-odd:#313a41;

--bg7:#242529;
--bg6:#fff5b1;
--bg5:#23292d;
--bg4: #1c1a1a;
--bg3:#242529;
--bg2:#2d343a;
--bg1:#42505e;
--bg1-on:#313c46bd;
--underline-blue: #234794 ;
--underline:rgba(255, 255, 0, 0.801);
--underline-red:#ff2f33;
--y-100: #fdf6ed;
--wp--preset--color--watery-yellow: #fff0b3;

.logo-menu-button img {filter: inherit;}

}

a {
  color: var(--text-link);
}
html.Dark .marker {
  background: yellow;
  color: #1c1a1a;
}
html.Dark .keyboard-key {
  box-shadow: 1px 2px 2px #6e6e6e;
}
div.speech-balloon {
  padding: .85em;
}
.sbs-line.sbp-l .speech-balloon,
.sbs-flat.sbp-l .speech-balloon,
.sbs-flat.sbp-r .speech-balloon {
  background-color: var(--bg7);
  border-color: var(--text-main);
  border-width: 0px;
}
.speech-balloon::before, .speech-balloon::after {
  top: calc(50% - 11px);  
}
.sbp-r:not(.not-nested-style) .speech-balloon::before {
  border-left-width: 16px;
  right: -16px;
}
.sbp-r:not(.not-nested-style) .speech-balloon::after {
  border-left-width: 16px;
  border-left-color: var(--bg2);
  right: -13px;
}
div.sbs-think:not(.not-nested-style) .speech-balloon::before, div.sbs-think:not(.not-nested-style) .speech-balloon::after {
  background-color: var(--bg2);
}
.sbs-flat:not(.not-nested-style) .speech-balloon::after {
  border-right-color: var(--bg7);
  display: none;
}
.sbs-flat:not(.not-nested-style) .speech-balloon::before {
  border-right-color: var(--bg7);
  border-left-color: var(--bg7);
  border-right-width: 16px;
  top: calc(50% - 11px);
  right: -12px;
}
.sbs-line:not(.not-nested-style) .speech-balloon::after, .sbs-line:not(.not-nested-style) .speech-balloon::before {
  border-right-color: var(--bg7);
}
.sbs-line.sbp-r:not(.not-nested-style) .speech-balloon::after {
  left: auto;
  right: -10px;
}


.sbp-l:not(.not-nested-style) .speech-balloon {
  margin-left: 1.5em;
}
.cocoon-block-balloon.not-nested-style.sbs-line.sbp-l,
.cocoon-block-balloon.not-nested-style.sbs-flat.sbp-l,
.cocoon-block-balloon.not-nested-style.sbs-flat.sbp-r {
  --cocoon-custom-border-color: var(--text-main);
}
  /* カスタム色対応 */
  .speech-wrap,
  .toggle-box,
  .timeline-box,
  .iconlist-box,
  .faq-wrap,
  .caption-box,
  .tab-caption-box,
  .label-box,
  .micro-balloon,
  .micro-text {
    --cocoon-custom-text-color: var(--text-main);
  }
  .info-list,
  .info-list .info-list-item-content-link,
  .widget_info_list {
    color: var(--text-main);
  }

  .breadcrumb.sbp-main-before,
  .breadcrumb.sbp-footer-before,
  .breadcrumb.pbp-main-before,
  .breadcrumb.pbp-footer-before {
    background-color: transparent;
  }

  .Dark .sns-buttons a {
    background-color: #585858;
  }

  .btn-blue, .ranking-item-detail a, .btn-wrap.btn-wrap-blue > a {
    background-color: var(--btn-color-blue);
    box-shadow: 0 2px 0 0px var(--btn-color-blue-shadow);
    border: 1px solid var(--btn-color-blue);
  }
  .btn-red, .ranking-item-link a, .btn-wrap.btn-wrap-red > a {
    background-color: var(--btn-color-red);
    box-shadow: 0 2px 0 0px var(--btn-color-red-shadow);
    border: 1px solid var(--btn-color-red);
  }
  .btn-l { border-radius: 50px;
  
    transition: all .4s ease-in-out;
    background-image: linear-gradient(to right, #fc6076, #ff9a44, #ef9d43, #e75516);
    box-shadow: 0 4px 15px 0 rgba(252, 104, 110, 0.75);
    padding: 1rem;
    display: block;
    text-decoration: none;
    line-height: 1.3;
    border: 0;
    max-width: 280px;
    margin: 0 auto;
  }
  .btn:after {
    margin-right: 20px;
  }

body {
  background-color: var(--bg7);
  font-family: var(--font-sans);
  /* font-family: "Hiragino Sans", 'Hiragino Kaku Gothic Pro'; */
  font-feature-settings: 'palt' on;
  letter-spacing: 0.6px;
  overflow-wrap: break-word;

}


.footer-bottom-logo img {
  height: 42px;
  width: auto;
}

.content {
  /* background-color: var(--bg7); */
  margin-top: 0;
}
.main {
  border: 0;
  background-color: var(--bg2);
  /* background-color: transparent; */
  color: var(--text-main);
  padding: 0px 0px 0px;
  width: calc(100% - 380px);
  margin: 20px auto 60px;
  border-radius: 0px;
  overflow: hidden;
}
.archive .main, .home .main {background-color: transparent;}
.single .main {
  border-radius: 10px 10px 10px 10px;
  background-color: var(--bg2);
}
.home .main {margin-top: 0;  margin-bottom: 0em;}
.entry-content {
  margin-top: 0em;
  padding: 0px 6.5%;
  margin-bottom: 5em;
}

button, [type="button"], [type="reset"], [type="submit"] {
  -webkit-appearance: none;
  border: 0;
}
.site-name-text-link {color: var(--text-main);padding: 0 0;}

/*トップページ*/
.list-title-in:before, .list-title-in:after {
  background-color: var(--text-main);
}

a.new-entry-card-link.widget-entry-card-link.a-wrap {
  margin-top: 10px;
}

.ModeButton {
  padding-right: 10px;
  padding-left: 20px;
}
.ModeButton button {
	cursor: pointer;
  width: 36px;
  height: 36px;
  background-color: transparent;
  text-indent: -9999em;
  display: block;
  position: relative;
}

.ModeButton button:before {
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    width: 24px;
    height: 24px;
    text-indent: -9999em;
    background-color: var(--icon);
    content: "";
    position: absolute;
    left: 6px;
    top: 6px;
  }

.ModeButton button#ModeButton--light:before {
    background-image: none;
    -webkit-mask: url(./images/light-icon.svg) no-repeat center center / contain;
    mask-image: url(./images/light-icon.svg);
}
.ModeButton button#ModeButton--dark:before {
    background-image: none;
    -webkit-mask: url(./images/dark-icon.svg) no-repeat center center / contain;
    mask-image: url(./images/dark-icon.svg);
}

#ModeButton--light { display: none;}
#ModeButton--dark { display: block;}
.Dark #ModeButton--light { display: block;}
.Dark #ModeButton--dark { display: none;}


.breadcrumb::-webkit-scrollbar {
  display: none;
}





#index-tab-1:checked ~ .index-tab-buttons .index-tab-button[for=index-tab-1],
#index-tab-2:checked ~ .index-tab-buttons .index-tab-button[for=index-tab-2],
#index-tab-3:checked ~ .index-tab-buttons .index-tab-button[for=index-tab-3],
#index-tab-4:checked ~ .index-tab-buttons .index-tab-button[for=index-tab-4] {
  background: none var(--bg1);
  border: 1px solid var(--bg1);
  color: var(--text-main);
}


.index-tab-buttons .index-tab-button {
  background-color: var(--bg1);
  border-color: var(--bg1);
}

/*続きを読む*/
.list-more-button {
  background-color: var(--bg2);
  color: var(--text-main);
}

.list-more-button:hover {
  color: var(--text-main);
  background-color: var(--bg1-on);
}

.pagination-next-link,
.page-numbers {
  background-color: var(--bg2);
  border-radius: 8px;
  color: var(--text-main);
  border-width: 0px;
  font-weight: 700;
  font-size: .9em;
  line-height: 44px;
  padding: 0;
}
.pagination-next-link {
  max-width: 540px;
  width: 80%;
  margin: 0 auto;
}


.page-numbers.current, .page-numbers.current:hover {
  background-color: var(--key-color2);
  color: var(--theme-color);
  box-shadow: none;
}

.pagination-next-link:hover,
.key-btn:hover {
  color: var(--text-main);
  background-color: var(--bg1-on);
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.08);
}

.pagination .page-numbers,
.pager-numbers .page-numbers {
  border-radius: 50%;
}

.page-numbers.dots {
  background: none;
}

a.page-numbers:hover {
  color: var(--text-main);
  background-color: var(--text-pink-sub);
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.08), 0 0 0 1px rgba(0, 0, 0, 0.04);
  border-width: 0;
}
.pagination-next a:hover {
  transition: all 0.3s ease-in-out;
  border-width: 0;
  color: var(--text-main);
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.08), 0 0 0 1px rgba(0, 0, 0, 0.04);
  background-color: var(--text-pink-sub);
}

/*検索窓*/
.search-box {
  width:100%;
  margin:0 0; 
  position: relative; display: flex;
  }
  input.search-edit {
    min-width: 250px;
    width: auto;
    background: var(--bg1);
    font-size: 15px;
    padding: 10px 60px 10px 12px;
    border-color: var(--bg1);
    border-radius: 30px;
  }	
  .search-submit {
    color: #fff;
    position: absolute;
    margin: 0;
    cursor: pointer;
    line-height: 0;
    border: 1px solid var(--bg1);
    padding: 0;
    background-color: var(--bg2);
}
  
  .search-box input::placeholder {
    font-size: 0.85em; 
    color: var(--text-placeholder);
    /*プレースホルダーのフォント大きさと色*/
  }

  .header-container-in.hlt-top-menu {
    padding:20px 20px;
    gap: 2em;    
  }
  .header-container .navi-in > ul li {
    width: auto;
    height: auto;
    line-height: 1;
  }
  .header-container .navi-in a {
    padding: 12px 16px;
    font-size: .9em;
    border-radius: 50px;
    color: var(--text-heading);
}

.header-container .navi {
  font-weight: normal;
}

.related-entry-card-title, .entry-card-title {
  font-size: 1.1em;
}


  /* スクロールバーのスタイルを調整（サイドバー目次） */
.sidebar ::-webkit-scrollbar {
  width: 6px; /* スクロールバーの幅 */
}

.sidebar ::-webkit-scrollbar-track {
  background: transparent; /* スクロールバーのトラックの背景色 */
}

.sidebar ::-webkit-scrollbar-thumb {
  border-radius: 50px;
  background: #aaa; /* スクロールバーのつまみの色 */
}
.sidebar ::-webkit-scrollbar-thumb:hover {
  background: #999; /* スクロールバーのつまみのホバー時の色 */
}



/*サイドバー*/
.sidebar {
  background-color: transparent;
  padding-top: 20px;
  padding-bottom: 60px;
}

#sidebar ul li a,
a.popular-entry-card-link {
  margin: 0px 0;
  padding: 1.2em 1.2em;
  line-height: 1.3;
  font-weight: 700;
  font-size: .9em;
  border-radius: 0;
}
#sidebar .wp-block-categories, #sidebar .widget_block ul {
  border-radius: 8px;
  overflow: hidden;
}
.new-entry-cards.widget-entry-cards {
  border-radius: 0px;
}
.widget_recent_entries ul li a, .widget_categories ul li a,
.widget_archive ul li a, .widget_pages ul li a,
.widget_meta ul li a, .widget_rss ul li a,
.widget_nav_menu ul li a,
.wp-block-group ul li a {
  border-bottom: 1px solid var(--bg7);
  padding-right: 15px;
  padding-left: 15px;
}

.author-box .sns-follow-buttons a.follow-button {
  color: var(--text-main);
}

.sidebar-menu-content,
.widget-entry-cards .a-wrap {
  color: var(--text-main);
  background-color: var(--bg2);
}

/*コメントウィジェット*/
div.recent-comment-content {
  background-color: var(--bg1);
  color: var(--text-main);
}

.recent-comment-content::after {
  border-bottom-color: var(--bg1);
}

/*検索ボックス*/
.search-box input::placeholder {
  color: var(--text-main);
}

.search-box input:focus, .search-box button:focus {
  outline: 0;
}

input, input[type=submit] {
  background-color: var(--bg3);
  color: var(--text-main);
  appearance: none;
}

input.search-edit {
  box-shadow: inherit;
}

input.search-edit::placeholder {
  color: var(--text-placeholder);
}
.Dark input.search-edit::placeholder {
  color: var(--bg2);
}

.search-submit {
  border-radius: 50px;
  width: 64px;
  height: 100%;
  top: 0;
  right: 0;
  font-size: 1em;
}

.box-menu {
  background: var(--bg2);
  color: var(--text-main);
}

.box-menu:hover {
  background-color: var(--bg1-on);
  color: var(--text-main);
  box-shadow: inset 2px 2px 0 0 var(--underline-red), 2px 2px 0 0 var(--underline-red), 2px 0 0 0 var(--underline-red), 0 2px 0 0 var(--underline-red);
}

.a-wrap, .widget_recent_entries ul li a, .widget_categories ul li a, .widget_archive ul li a, .widget_pages ul li a, .widget_meta ul li a, .widget_rss ul li a, .widget_nav_menu ul li a, .wp-block-group ul li a {
  color: var(--text-main);
  background-color: var(--bg2);
  box-shadow: inherit;
  border-radius: 0;
  transition-duration: 0.3s;
}

.a-wrap:hover,
.widget_recent_entries ul li a:hover, .widget_categories ul li a:hover,
.widget_archive ul li a:hover, .widget_pages ul li a:hover,
.widget_meta ul li a:hover, .widget_rss ul li a:hover,
.widget_nav_menu ul li a:hover,
.wp-block-group ul li a:hover {
  color: var(--text-main);
  background-color: var(--bg1-on);
  /* transform: translateX(4px); */
  box-shadow: inherit;
  transition-duration: 0.3s;
  /* background-color: inherit;
  transform: inherit;
  box-shadow: inherit;
  transition-duration: inherit; */
}


.a-wrap > div {
  border: none;
}

.recommended {
  margin: 0 auto;
}
.recommended .navi-entry-cards {
margin-bottom: 0;
}

/*リスト*/
.list {
  display: flex;
  margin: 0 auto;
  justify-content: space-between;
  row-gap: 1em;
}
.related-entry-card-meta, .entry-card-meta {
  text-align: left;
}
.e-card-info {
  justify-content: flex-start;
}
.ect-vertical-card {
  column-gap: 2em;
}

.list .entry-card-wrap, .ect-vertical-card .entry-card-wrap {
  padding: 0px;
  width: calc(50% - 1em);
  display: inline-block;
  border-radius: 8px;
  background-color: transparent;
}

.ect-vertical-card.ect-3-columns {
  column-gap: 1.2em;
}
.ect-vertical-card.ect-3-columns .entry-card-wrap {
  width: calc((100% - 2.4em) /3 );
}
.ect-vertical-card .entry-card-wrap .entry-card-thumb {
  margin: 0 auto;
  border-radius: 8px;
    overflow: hidden;
}

/* .ect-vertical-card .entry-card-wrap:first-child {
  width: calc(100%);
} */
.archive-title span {
    display: none;
}
.related-entry-card-title, .entry-card-title {
  font-size: .95em;
  margin-bottom: 0;
  line-height: 1.5;
  font-weight: 700;
}
.ect-vertical-card .entry-card-wrap .entry-card {
  row-gap: 12px;
}
.ect-vertical-card .entry-card-wrap .entry-card-content {
  padding: 0em 0em;
}
a.follow-button.feedly-button.feedly-follow-button-sq{
  display:none;
  }
  a.follow-button.rss-button.rss-follow-button-sq{
  display:none;
  }
.ect-vertical-card .entry-card-wrap .entry-card-meta {
  margin-top: inherit;
}

/*テキスト*/
.break-keep {
  word-break: keep-all;
}

.mb0 { margin-bottom: 0 !important;}
.mb1 { margin-bottom: 1em !important;}
.mt-1 { margin-top: -1em !important;}
.mt3 { margin-top: 3em !important;}

.box-section {
  position: relative;
  margin: 0 auto;
  background-color: transparent;
}

.flex-wrap {
  display: flex;
  justify-content: center;
  gap: 1.8em;
  flex-direction: row;
}
.flex-wrap img {
width: 100%;
min-width: 85px;
margin: 0 auto;
}

.flex-wrap img.icon-img {
  min-width: 200px;
  margin: 0 0 0;
}

.flex-left img.guide-img {
  max-width: 85px;
  float: right;
  margin: 0 0 0 10px;
}

/*カルーセル*/
div #carousel-in {
  background-color: var(--bg3);
}

.slick-list {
}
.slide-items, .article .slide-items {
	margin: 0 auto 1.8em;
  padding: 0;
  border-radius: 6px;
  overflow: hidden;

}
.slide-items .slick-slide {
  margin: 0 auto;
}

.slide-items img {
	/* height: 40vh;  */
	margin: auto;
}

/* Dots */
.slide-dots.slick-slider{
    margin-bottom: 30px;
}

.slide-dots, .article .slide-dots{
    display: block;
    width: 100%;
    padding: 0;
    margin: 0;
    list-style: none;
    text-align: center;
}

.slide-dots li, .article .slide-dots li {
    position: relative;
    display: inline-block;
    width: 16px;
    height: 16px;
    margin: 8px 4px 0;
    padding: 0;
    cursor: pointer;
}

.slide-dots li button {
    font-size: 0;
    line-height: 0;
    display: block;
    width: 16px;
    height: 16px;
    cursor: pointer;
    color: transparent;
    border: 0;
    outline: none;
    background: transparent;
  }

.slide-dots li button:hover,
.slide-dots li button:focus{
    outline: none;
}

.slide-dots li button:hover:before,
.slide-dots li button:focus:before{
    opacity: 0.8;
}

.slide-dots li button:before{
    font-style:normal;
    line-height: 1;
	border-radius:20px;
    position: absolute;
    top: 0;
    left: 0;
    width: 9px;
    height: 9px;
    content: '';
    text-align: center;
    background: var(--alert-box-bg);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.slide-dots li.slick-active button:before{
    opacity: .75;
    color: red;
	border:none;
	background: var(--text-heading);
}

@media screen and (min-width: 740px) {
		
    .slide-prev, 
    .slide-next {
        position: absolute;
        top: 44%;
        cursor: pointer;
        outline: none;
        border-top: 2px solid var(--bg1);
        border-right: 2px solid var(--bg1);
        height: 20px;
        width: 20px;
	    z-index:5;
    }

    .slide-prev {
        left: 16px;
        transform: rotate(-135deg);
    }

    .slide-next {
        right: 16px;
        transform: rotate(45deg);
    }

}


/*アコーディオン*/
.toggle-button {
  font-weight: 700;
  font-size: 0.95em;
  display: block;
  cursor: pointer;
  padding: 10px 10px;
  color: var(--text-main);
  background-color: var(--bg2);
  border-width: 2px;
  border-color: var(--bg1);
  text-align: center;
  border-radius: 5px;
}
.toggle-wrap .toggle-content {
  opacity: 0;
  padding:0 3.0em;
  transition: all 0.3s ease-in-out;
  border-color: var(--bg1);
  border-width: 0;
  border-radius: 5px;
}
.toggle-checkbox:checked ~ .toggle-content {
  transition: all 0.3s ease-in-out;
  padding: 1em 3.0em 3.0em;
  color: var(--text-main);
  background-color: var(--bg2);
  border-width: 0;
  border-color: var(--bg1);
  border-radius: 5px;
}

.toggle-wrap .toggle-button + p {
  margin-bottom: 0;
}


/*ナビ*/
.navi {
  background-color: var(--bg3);
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.25);
  font-weight: bold;
}

.navi a {
  color: var(--icon);
}

.navi a:hover {
  color: var(--text-main);
  background-color: var(--bg7);
}

.navi ul .sub-menu {
  background-color: var(--bg2);
  opacity: 0.95;
}

.navi ul .sub-menu a {
  color: var(--text-main);
}

.navi ul .sub-menu a:hover {
  background-color: var(--bg1-on);
}

.navi ul .sub-menu a .sub-caption {
  opacity: 0.8;
}

.navi-in > ul .sub-menu {
  display: block;
}

.navi-in > ul .sub-menu li {
  visibility: hidden;
  transition: all 0.2s ease;
  height: 0;
  opacity: 0;
}

.navi-in > ul li:hover > ul > li {
  transition: all 0.2s ease;
  visibility: visible;
  height: 60px;
  opacity: 1;
}

.navi-in > ul .sub-menu .sub-menu li {
  display: none;
}

.navi-in > ul .sub-menu li:hover > ul > li {
  display: block;
}

.navi-in > ul > li:last-of-type .sub-menu {
  right: 0;
}

/*ヘッダー*/
.logo-menu-button img {
  -webkit-filter: drop-shadow(0px 1px 0px rgba(250, 255, 0, 1.0));
  filter: drop-shadow(0px 1px 0px rgba(250, 255, 0, 1.0));
  
}

.mobile-menu-buttons {
  background-color: var(--theme-color);
  /* box-shadow: 0 0 0px 1px rgba(var(--icon-rgb), 0.35); */
  box-shadow: inherit;

  color: var(--icon);
  align-items: center;
  transition: top 0.3s;
}
#navi-menu-close, #sidebar-menu-close, #search-menu-close, #share-menu-close, #follow-menu-close {
  background-color: var(--theme-color);
}
#navi-menu-input:checked ~ #navi-menu-close, #sidebar-menu-input:checked ~ #sidebar-menu-close, #search-menu-input:checked ~ #search-menu-close, #share-menu-input:checked ~ #share-menu-close, #follow-menu-input:checked ~ #follow-menu-close {
    opacity: 0.95;
}

.mobile-header-menu-buttons .search-box {
  width: 80%;
  width: 320px;
  margin: 0 auto;
}



.mobile-menu-buttons .menu-button > a {
  color: var(--text-main);
  line-height: 1;
}
.mobile-menu-buttons .menu-button.logo-menu-button {
  padding: 0 20px 0 48px;
}

.mobile-menu-buttons .menu-button {
  width: auto;
}
.mobile-menu-buttons .menu-icon {
  font-size: 20px;
}
.mobile-menu-buttons .menu-caption {
  display: none;
}

.mobile-menu-buttons .menu-icon .fas:before, .go-to-top-button .fas:before, #mobile-toc-widget-wrap .menu-trigger span:before, .post-date .far:before, .post-update .fas:before, .search-submit .fas:before, .mobile-menu-buttons .menu-close-button .fas:before {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  width: 24px;
  height: 24px;
  display: inline-block;
  text-indent: -9999em;
  background-color: var(--icon);
}
.mobile-menu-buttons .search-menu-icon .fas:before, .search-submit .fas:before {
  background-image: none;
  -webkit-mask: url(./images/search-icon.svg) no-repeat center center / 19px;
  mask-image: url(./images/search-icon.svg);
}
.search-submit .fas:before {
  -webkit-mask: url(./images/search-icon.svg) no-repeat center center / 18px;
}


.mobile-menu-buttons .navi-menu-button .fas:before {
  background-image: none;
  -webkit-mask: url(./images/menu-icon.svg) no-repeat center center / contain;
  mask-image: url(./images/menu-icon.svg);
}

.mobile-menu-buttons .menu-close-button .fas:before {
  background-image: none;
  -webkit-mask: url(./images/close-icon.svg) no-repeat center center / 36px;
  mask-image: url(./images/close-icon.svg);
}

.go-to-top-button .fas:before {
  background-image: none;
  -webkit-mask: url(./images/up-arrow.svg) no-repeat center center / 16px;
  mask-image: url(./images/up-arrow.svg);
}


#mobile-toc-widget-wrap .menu-trigger span:before{
  background-image: none;
  -webkit-mask: url(./images/index-icon.svg) no-repeat center center / 16px;
  mask-image: url(./images/index-icon.svg);
}
.post-date .far:before {
  background-image: none;
  -webkit-mask: url(./images/clock-icon.svg) no-repeat center center / contain;
  mask-image: url(./images/clock-icon.svg);
}
.post-update .fas:before {
  background-image: none;
  -webkit-mask: url(./images/time-icon.svg) no-repeat center center / contain;
  mask-image: url(./images/time-icon.svg);
}


.mobile-menu-buttons .menu-close-button .fas {
  padding: 16px 20px 0;
}
.menu-content .menu-drawer {
  padding: 30px 1em 30px;
}
.menu-drawer a {
  color: var(--icon);
  text-align: center;
  font-size: 1.1em;
  padding: 16px 20px;
  font-weight: 500;
}

.menu-close-button {
  text-align: left;
}

.post-date .far:before, .post-update .fas:before {
width: 16px;
height: 16px;
}

.menu-content {
  max-width: inherit;
  background-color: var(--theme-color);
  transition: 0.3s ease-in-out;
}


.navi-menu-content {
  -webkit-transform: translateY(-100%);
  transform: translateY(-100%);
}
#navi-menu-input:checked ~ #navi-menu-content, #sidebar-menu-input:checked ~ #sidebar-menu-content, #search-menu-input:checked ~ #search-menu-content, #share-menu-input:checked ~ #share-menu-content, #follow-menu-input:checked ~ #follow-menu-content {
  transition: 0.3s ease-in-out;
  -webkit-transform: translateY(0%);
  transform: translateY(0%);
  opacity: 1;
}



.fixed-header .header {
  background-color: transparent;
}

.fixed-header .navi {
  box-shadow: none;
}

.toc a {
  color: var(--text-main);
}
.toc .toc-list {
  padding-left: 1.5em;
}
.toc .toc-list li::marker {
  color: var(--text-heading);
  font-weight: 700;
  font-size: 90%;
  margin-right: 1em;
}
.toc .toc-list ol {
  padding-left: 1.5em;
  margin: 0;
}
/* .toc .toc-list ul, .toc .toc-list ol {
  padding-left: 1em;
  margin: 0;
} */



div.speech-balloon {
  background-color: transparent;
}

.cocoon-block-balloon.not-nested-style {
  --cocoon-custom-background-color: var(--bg4);
}

.rating-number {
  color: var(--text-main);
}

/*フッター*/
.go-to-top {
  right: 2.5em;
  bottom: 1.2em;
}



.go-to-top-button {
  background-color: var(--bg2);
  color: var(--text-main);
  border: 1px solid rgba(var(--icon-rgb), 0.35);
  width: auto;
  height: auto;
  position: relative;
  display: flex;
  align-items: center;
  gap: 0px;
  border-radius: 0px;
  padding-left: 10px;
  padding-left: .5em;
}
.go-to-top-button .fas { width: 24px; height: 24px; font-size: 16px;}

.go-to-top-button::after {
  content: attr(aria-label);
  display: block;
  font-weight: 700;
  color: var(--text-sub);
  font-size: 12px;
  padding: 0px 0px;
  width: 42px;
  height: 36px;
  line-height: 37px;
  text-align: left;
  padding-left: 8px;
}

.grecaptcha-badge {
  opacity: 0;
}
.footer-bottom {
  margin-top: 0px;
  padding: 60px 20px 20px 20px;
  font-size: 12px;
}
.copyright {
  margin-top: 1em;
  color: var(--text-main);
}
#footer {
  border-top: 1px solid rgba(var(--icon-rgb), 0.2);
  background-color: var(--bg7);
  padding: 1em 0em 6em;
  margin: 0 auto;
}

div .footer-bottom-content {
  color: var(--text-main);
}


.navi-footer-in a {
  color: var(--text-main);
}

.navi-footer-in a:hover {
  background-color: var(--bg1-on);
}


.header-container-in.hlt-top-menu .wrap {
  padding: 0 12px;
}

.header-container-in.hlt-top-menu .logo-header img {
  max-height: 56px;
}


/*---
記事
---*/
.wrap {
  width: auto;
  max-width: 1220px;
  padding: 0 20px;
}

/*表*/
tr {
  background-color: var(--bg2);
}

table tr:nth-of-type(2n+1) {
  background-color: inherit;
}
table tr:nth-of-type(2n) {
  background-color: var(--bg-table-odd);
}

table th,
.scrollable-table th {
  background-color: var(--bg-table-th);
}
.scrollable-table {
  border-radius: 6px;
}

/*ソースコード*/
pre.wp-block-code:where(:not(.hljs)),
pre:where(:not(.hljs)) {
  color: var(--text-main);
  background-color: var(--bg1);
}

/*パンくずリスト*/
.breadcrumb {
  color: var(--icon);
  margin: 0 auto;
}
.breadcrumb-caption {
  margin: 0 auto;
}
.breadcrumb a, .breadcrumb .fas {
  color: var(--text-main);
}
.breadcrumb .fa-home, .breadcrumb .fa-folder, .breadcrumb .fa-file {
  display: none;
}

/*snsボタン*/
.sns-share-message,
.sns-follow-message {
  color: var(--text-main);
}

/*コメント*/
.comment-btn {
  background-color: var(--bg1);
  color: var(--text-main);
}

.comment-btn:hover {
  background-color: var(--bg1-on);
  color: var(--text-main);
}

textarea {
  background-color: var(--bg3);
  color: var(--text-main);
}

/*引用*/
blockquote {
  background-color: var(--bg2);
}

#list {
  margin-bottom: 1em;
}

/*吹き出し*/
.speech-balloon::after {
  border-right-color: var(--bg2);
}

/*キーボードキー*/
.keyboard-key {
  background-color: var(--bg2);
  color: var(--text-main);
}

/*アンダーライン*/
.marker-under-blue {
  background: linear-gradient(transparent 60%, var(--underline-blue) 0%);
}

.marker-under {
  background: linear-gradient(transparent 70%, var(--underline) 0%);
}

.marker-under-red {
  background: linear-gradient(transparent 60%, var(--underline-red) 0%);
}

.marker-blue {
  background: var(--underline-blue);
  color: var(--text-main);
}

.marker-red {
  background: var(--underline-red);
  color: var(--text-main);
}

/*アイコンボックス*/
.is-style-information-box, .information-box, .information,
.is-style-question-box, .question-box, .question,
.is-style-alert-box, .alert-box, .alert,
.is-style-memo-box, .memo-box, .memo,
.is-style-comment-box, .comment-box, .comment,
.is-style-good-box, .good-box, .good,
.is-style-bad-box, .bad-box, .bad,
.is-style-ok-box, .ok-box, .ok,
.is-style-ng-box, .ng-box,
.is-style-profile-box, .profile-box {
  background-color: var(--bg3);
  border-width: 2px;
  border: 2px solid #009efd;
  border-radius: 6px;
}
.information-box {
  background-color: var(--bg-table-odd);
  border: 0px;
}
.memo-box {
  border: 2px solid var(--bg4);
}
.is-style-information-box::before, .information-box::before, .information::before {
  color: #009efd;
  top: 1.2em;
  left: 0.5em;
  border-right: 0px;
}
.is-style-alert-box, .alert-box, .alert {
  background: var(--alert-box-bg);
  border: 0px solid #f6b9b9;
  color: var(--text-alart-box);
}
.is-style-alert-box::before, .alert-box::before, .alert::before {
  color: #ff4f80;
  top: 1.2em;
  left: 0.5em;
  border-right: 0px;
}



/*付箋風・プライマリーボックス*/
.blank-box.sticky,
.sticky.is-style-blank-box-red,
.sticky.is-style-blank-box-navy,
.sticky.is-style-blank-box-blue,
.sticky.is-style-blank-box-yellow,
.sticky.is-style-blank-box-green,
.sticky.is-style-blank-box-pink,
.sticky.is-style-blank-box-orange,
.is-style-sticky-gray,
.is-style-sticky-yellow,
.is-style-sticky-red,
.is-style-sticky-blue,
.is-style-sticky-green,
.is-style-primary-box, .primary-box, .sp-primary, .primary {
  color: #1c1a1a;
}

/*ラベルボックス*/
.label-box-label {
  text-shadow: var(--bg3) 3px 0 0, var(--bg3) 2px 1px 0, var(--bg3) 2px 2px 0, var(--bg3) 2px 3px 0, var(--bg3) 1px 3px 0, var(--bg3) 0 3px 0, var(--bg3) -1px 3px 0, var(--bg3) -2px 2px 0, var(--bg3) -3px 1px 0, var(--bg3) -3px 0 0, var(--bg3) -3px -1px 0, var(--bg3) -3px -2px 0, var(--bg3) -2px -2px 0, var(--bg3) -1px -3px 0, var(--bg3) 0 -3px 0, var(--bg3) 1px -3px 0, var(--bg3) 2px -2px 0, var(--bg3) 2px -2px 0, var(--bg3) 3px -1px 0;
}

/*見出しボックス、タブ見出しボックス、アコーディオンボックス*/
.caption-box:not(.has-border-color, [class*=cb-]) .caption-box-label {
  color: #1c1a1a;
}

.tab-caption-box:not(.has-border-color, [class*=tcb-]) span.tab-caption-box-label-text {
  color: #1c1a1a;
}

.toggle-box:not(.has-border-color, [class*=tb-]) label.toggle-button {
  color: #1c1a1a;
}



/*マイクロバルーン*/
.micro-balloon {
  background-color: var(--bg3);
}

.micro-balloon::after {
  border-top-color: var(--bg3);
}

.micro-bottom.micro-balloon::after {
  border-bottom-color: var(--bg3);
}


.article .entry-content .column-wrap.column-mobile {
  flex-direction: row;
  align-items: center;
}





/*円グラフ*/
.chart {
  width: 200px;
  height: 200px;
  margin: 0 auto;
  border-radius: 50%;
  position: relative;
  background: conic-gradient(
      var(--male-color) 0%,
      var(--male-color) var(--male-percent),
      var(--female-color) var(--male-percent),
      var(--female-color) 100%
  );
}

.chart-inner {
  width: 160px;
  height: 160px;
  border-radius: 50%;
  background-color: var(--bg2);
  position: absolute;
  top: 50%;
  left: 50%;
  text-align: center;
  transform: translate(-50%, -50%);
}
.chart-inner p {
  padding: 48px 12px;
  line-height: 1.5;
  font-weight: 700;
  font-size: 1.8em;
}
.chart-inner p span {
  display: block;
  font-size: .5em;
  border-radius: 50px;
  padding: 6px 10px;
  line-height: 1;
  width: 86px;
  margin: 0 auto;
}

/*検索案内*/
.search-form div.sform {
  background-color: var(--bg3);
}

.search-form div.sbtn::after {
  color: var(--text-main);
}

.search-form div.sbtn:hover {
  color: var(--text-main);
  background-color: var(--bg1-on);
}

/*faq*/
.faq-item-label {
  font-size: 26px;
}

.faq-answer-label {
  font-size: 20px;
  margin-left: 4px;
}

.faq-answer-content.faq-item-content p {
  font-size: 16px;
}

/*投稿者*/
.body .author-box {
  line-height: 1;
  margin: 0 auto;
  border: 0px;
  font-size: .85em;
  padding: 1.0em 0px;
  border-radius: 0;
  color: var(--text-main);
  background: var(--bg2);
  border: 0px;
  display: flex;
  gap: 1.25em;
  align-items: flex-start;
}
.author-description {
  margin-bottom: 0;
}
.author-thumb {
  width: 25%;
  margin-right: 0;
  overflow: hidden;
  margin-top: 0;
  float: inherit;
  max-width: 90px;
}
.author-thumb img {
  vertical-align: bottom;
  border-radius: 50px;
}
.author-content {
  margin-left: 0;
  flex: 1;
}
.author-widget-name {
  color: var(--text-heading);
  margin-bottom: 1.2em;
  font-weight: bold;
  font-size: 1.1em;
  padding: 0 0;
  position: absolute;
  top: -1.75em;
  left: 0;
}
.author-box .sns-buttons {
  column-gap: 8px; margin-top: 0;
}
.author-box .author-name {
  font-size: 1.15em;
  margin: 0.25em auto;
}
.author-box .author-name a {
  text-decoration: none;
  color: var(--text-main);
  color: var(--text-heading);
}
.author-box p {
  margin: 0.5em auto;
  line-height: 1.4;
}
.author-box .sns-follow-buttons a.follow-button {
  font-size: 22px;
  width: 36px;
  height: 36px;
  border-radius: 50px;
  color: var(--text-main);
  background-color: var(--bg3);
}
.article-footer {
  display: none;
}
.related-entries {
  padding: 0 6.5%;
}


.article dd {
  margin-left: 0;
}
.article dt {
  margin-bottom: 1.8em;
}

.rect-vertical-card-3 .related-list {
  column-gap: 0%;
  margin: 0 -10px 1.8em;
}
.rect-vertical-card-3 .related-list p {
  text-align: center;
  width: 100%;
  padding: 5em 0;
  font-size: .9em;

}
.rect-vertical-card-3 .related-entry-card-wrap {
  width: calc(100% / 3);
}

.rect-vertical-card .related-entry-card-wrap {
  padding: 0;
}
.rect-vertical-card .related-entry-card-wrap {
  padding: 1.75%;
}
.rect-vertical-card .related-entry-card {
  gap: 3.5%;
}
.rect-vertical-card .related-entry-card-content {
  padding: 0px 0 10px;
}
.rect-vertical-card .related-entry-card-title {
  line-height: 1.4;
  font-weight: 700;
  font-size: .85em;
}

.caution-txt {
  padding: .75em .75em;
  margin: 0 auto;
  display: inline-block;
  display: block;
  max-width: 480px;
  border-radius: 3px;
  background-color: var(--label-bg-shadow);
  text-align: center;
  font-size: .9em;
}

.sns-buttons {
  margin-top: 0;
  margin-bottom: 0;
}
.date-tags {
  line-height: 1;
  text-align: left;
  margin-bottom: 0;
}
.post-date, .post-update, .post-author, .amp-back, .entry-category {
  display: inline-block;
  font-size: .825em;
  font-weight: 700;
  color: var(--icon);
  padding-left: 0;
}
.main .article-header .sns-buttons {
  column-gap: 8px;
  flex-wrap: nowrap;
}
.main .article-header .sns-share.ss-high-and-low-lc a > span {
  padding-top: 0px;
}

.main .article-header .sns-buttons a {
  width: 36px;
  height: 36px;
  border-radius: 50px;
}
.sns-share.ss-high-and-low-lc a .button-caption.button-caption {
  display: none;
}


.single .main .article-header, .page .main .article-header {
  gap: 10px;
  column-gap: 0;
  display: grid;
  flex-direction: column;
  grid-template-rows: auto auto auto;
  justify-content: normal;
  grid-template-columns: auto auto;
  margin-bottom: 1em;
}

.eye-catch {
  margin-bottom: 0;
}
.main .entry-title, .main .archive-title {
  line-height: 1.4;
  padding: 6.5% 6.5% 10px;
  margin: 0px 0;
  font-size: 1.45em;
  font-family: var(--font-bold);
  font-weight: 700;
}
.single .main .widget .entry-title {
  padding: 2.5% 6.5% 0px;
}


.single .main .widget.widget_author_box {
  grid-column: 1 / 3;
  order: 3;
  padding: 5.5% 6.5% 2.5%;
}

.single .main .widget .author-box {
  padding: 16px 8px 16px 16px;
  background: var(--bg7);
  border-radius: 8px;
}

.main .archive-title {
  padding: 0px 0px 2em;
  font-size: 1.25em;
  text-align: center;
  margin: 0px auto;
}


.main .article-header .eye-catch-wrap {
  order: 0;
  grid-row: 1 / 2;
  grid-column: 1 / 3;
}

.main .article-header .entry-title {
  order: 1;
  grid-row: 1 / 2;
  grid-column: 1 / 3;
}

.main .has-post-thumbnail .article-header .entry-title {
  grid-row: 2 / 3;
  position: relative;
  padding: 4.5% 6.5% 10px;}

  .single .main .has-post-thumbnail .article-header .entry-title::after {
    content: "PR記事";
    font-size: 11px;
    font-weight: 600;
    padding: 2px .75em;
    color: var(--icon);
    border: 1px solid var(--bg7);
    background-color: var(--bg7);
    display: inline-block;
    float: left;
    margin: 0;
    position: absolute;
    right: 6.5%;
    top: .2em;
    border-radius: 2px;
}

.main .article-header .date-tags {
  order: 2;
  grid-row: 2 / 3;
  grid-column: 1 / 2;
  padding-left: 12%;
  align-self: start;
  white-space: nowrap;
  display: flex;
  align-items: center;
}
.main .has-post-thumbnail .article-header .date-tags {
  grid-row: 3 / 4;
}



.post-date, .post-update, .post-author, .amp-back {
  display: flex;
  align-items: center;
}
.main .article-header .ss-top {
  order: 3;
  grid-row: 2 / 3;
  grid-column: 2 / 3;
  padding-right: 12%;
  justify-self: end;
}
.main .has-post-thumbnail .article-header .ss-top {
  grid-row: 3 / 4;
}

.main .article-header .read-time {
  order: 4;
  grid-row: 4 / 5;
  grid-column: 1 / 3;

}

.footer-widgets {
}
.footer-center {
  width: calc(33.33% * 2);
}
.footer-right { display: none; }

.footer-widgets h3.widget-title {
  color: var(--icon);
  font-family: var(--font-bold);
  font-weight: 700;
  padding: 0px 0 8px;
  margin: 0 auto;
  font-size: .925em;
}


.wp-caption {
  padding-top: 0px;
  border: 1px solid var(--bg1);
  border-radius: 6px;
  background-color: var(--bg2);
  color: var(--text-main);
  text-align: center;
  overflow: hidden;
  width: 100% !important;
}
.wp-caption .wp-caption-text, .gallery .gallery-caption {
  font-weight: bold;
  padding: 0px 4px 6px;
}



ul#menu-applist, .footer .menu {
  display: flex;
  gap: 0.75em;
}
.footer .menu {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
}
ul#menu-applist li a, .footer .menu li a {
  border-radius: 8px;
  font-size: .75em;
  font-weight: 700;
  gap: .5em;
  line-height: 1.1;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  min-width: 100px;
  padding: 0.5em 0.75em 0.5em .75em;
}

.menu li .site-icon {
  display: block;
  margin: 0;
  min-width: 40px;
  height: 40px;
  border-radius: 60px;
  background-color: var(--bg1);
}
.sidebar ul#menu-applist {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
}
.sidebar ul#menu-applist li a { 
  flex-direction: column;
  min-width: inherit;
  padding: 0.75em .25em;
  font-size: .65em;
}



.home #popular_entries-2 .widget-title, .home .widget_popular_entries .widget-title {
  line-height: 1.4;
  padding: 10px 20px 10px;
  margin: 0px 0;
  font-size: 1.2em;
  font-family: var(--font-bold);
  font-weight: 700;
}

.home .widget_popular_entries .widget-entry-cards {
  margin: 0 auto;
  padding: 0px 20px 0px;
  display: grid;
  gap: 20px;
  row-gap: 0;
  grid-template-columns: repeat(3, calc((100% - 40px)/3));
}
.home .widget_popular_entries .widget-entry-cards.large-thumb-on .card-content {
  padding: 1.8em  1.1em 1.2em;
  font-size: 1.0em;
  background: linear-gradient(180deg, transparent, #555);
  color: var(--cocoon-white-color);
  transition: all 0.05s;
}
.home .widget_popular_entries .widget-entry-cards.ranking-visible .card-thumb::before {
  top: 0;
  left: 0;
  padding: 4px;
  width: 28px;
  height: 28px;
  line-height: 28px;
  font-size: 17px;
}

.home .main .widget-title, .home .article h3.widget-title {
  line-height: 1.4;
  padding: 16px 0px 8px;
  margin: 0px 0;
  font-size: 1.2em;
  font-family: var(--font-bold);
  font-weight: 700;
  line-height: 1.7;
  color: var(--text-heading);
}
.home .main .widget-title {
  /* margin-top: 1.2em; */
}

.home .entry-header, .home .main .article-header {
  margin-bottom: 0;
}
.home .main .entry-content {
  box-shadow: inset 0 0 0 2px var(--bg1);
  border-radius: 8px;
  padding: 20px 6.5%;
  background-color: var(--bg2);
  margin-bottom: 0;
}
.home .widget_info_list .widget-title {
  /* padding-bottom: 8px;
  background: transparent; */
}
.home .main .textwidget .w100 {
  /* padding: 0 20px 20px;
  background-color: var(--bg2);
  margin-bottom: 1em; */
}
.home .main .textwidget.custom-html-widget {
  /* display: grid; */
  gap: 20px;
  /* grid-template-columns: repeat(3, calc((100% - 20px) / 2)); */
  row-gap: 0;
  margin-bottom: 1.8em;
}



.home .widget_popular_entries .widget-entry-cards figure {
  margin: 0;
}
.home .widget_popular_entries .widget-entry-cards .a-wrap {
  padding: 0;
  margin: 0;
  background-color: transparent;
	border-radius: 8px;
	overflow: hidden;
}
.home .widget_popular_entries .widget-entry-cards .a-wrap:nth-last-child(-n+2) {
  display: none;
}

/*見出し*/
.article h2 {
  margin-bottom: 1.0em;
  margin-top: 2.0em;
  background-color: transparent;
  /* background-color: var(--bg1); */
  font-size: 1.45em;
  padding: 1.2em 1.2em;
  font-family: var(--font-bold);
  font-weight: 700;
  border-radius: 0;

  /* position: sticky;
  z-index: 4;
  top: 20px; */
}
.article #toc + h2 {
  margin-top: 2.5em;
}
.article h3 {
  font-size: 1.2em;
  font-family: var(--font-bold);
  font-weight: 700;
}

.sidebar h2,
.sidebar h3 {
  background: none;
}

.article h3,
.article h4,
.article h5,
.article h6 {
  border: none;
}

/*カスタムCSS*/
.site-icon, .menu li .site-icon {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.site-icon.pj88, .menu li.pj88 .site-icon {
  background-image: url(/wp-content/uploads/2024/10/pj-icon.webp); 
 }
 .pj88-bg, .featured-apps.pj88-bg {
   background-color: rgba(var(--app-bg-pj88-rgb), .2);
 }
 .site-icon.paters, .menu li.paters .site-icon {
 background-image: url(/wp-content/uploads/2024/08/paters-icon.webp); 
}
.paters-bg, .featured-apps.paters-bg {
  background-color: rgba(var(--app-bg-paters-rgb), .2);
}
.site-icon.lovean, .menu li.lovean .site-icon {
  background-image: url(/wp-content/uploads/2024/08/lovean-logo.webp); 
}
.lovean-bg, .featured-apps.lovean-bg {
  background-color: rgba(var(--app-bg-lovean-rgb), .2);
}
.site-icon.wakuwaku, .menu li.wakuwaku .site-icon {
  background-image: url(/wp-content/uploads/2024/08/wakuwaku-icon.webp); 
} 
.wakuwaku-bg, .featured-apps.wakuwaku-bg {
  background-color: rgba(var(--app-bg-wakuwaku-rgb), .2);
}

.site-icon.pato, .menu li.pato .site-icon {
  background-image: url(/wp-content/uploads/2024/10/pato-icon.webp); 
} 
.pato-bg, .featured-apps.pato-bg {
  background-color: rgba(var(--app-bg-pato-rgb), .2);
}
.site-icon.patolo, .menu li.patolo .site-icon {
  background-image: url(/wp-content/uploads/2024/10/patolo-icon.webp); 
} 
.patolo-bg, .featured-apps.patolo-bg {
  background-color: rgba(var(--app-bg-patolo-rgb), .2);
}


.site-icon.ikukuru, .menu li.ikukuru .site-icon {
  background-image: url(/wp-content/uploads/2024/09/ikukuru-icon.webp); 
} 
.ikukuru-bg, .featured-apps.ikukuru-bg {
  background-color: rgba(var(--app-bg-ikukuru-rgb), .2);
}

.site-icon.paddy, .menu li.paddy .site-icon {
  background-image: url(/wp-content/uploads/2024/08/paddy-icon-1.webp); 
} 

.paddy-bg, .featured-apps.paddy-bg {
  background-color: rgba(var(--app-bg-paddy-rgb), .2);
}

.site-icon.pappy, .menu li.pappy .site-icon {
  background-image: url(/wp-content/uploads/2024/10/pappy-icon.webp); 
} 
.pappy-bg, .featured-apps.pappy-bg {
  background-color: rgba(var(--app-bg-pappy-rgb), .2);
}

.site-icon.patrona, .menu li.patrona .site-icon {
  background-image: url(/wp-content/uploads/2024/09/patrona-icon.png); 
} 
.patrona-bg, .featured-apps.patrona-bg {
  background-color: rgba(var(--app-bg-patrona-rgb), .2);
}


.site-icon.sugardaddy, .menu li.sugardaddy .site-icon {
  background-image: url(/wp-content/uploads/2024/08/sugardaddy-icon.webp); 
} 
.sugardaddy-bg, .featured-apps.sugardaddy-bg {
  background-color: rgba(var(--app-bg-sugardaddy-rgb), .2);
}

.site-icon.ikukuru, .menu li.ikukuru .site-icon {
  background-image: url(/wp-content/uploads/2024/09/194964.webp); 
} 
.ikukuru-bg, .featured-apps.ikukuru-bg {
  background-color: rgba(var(--app-bg-ikukuru-rgb), .2);
}
.site-icon.patorona, .menu li.patorona .site-icon {
  background-image: url(/wp-content/uploads/2024/09/patorona-logo.webp); 
} 
.patorona-bg, .featured-apps.patorona-bg {
  background-color: rgba(var(--app-bg-patorona-rgb), .2);
}

.site-icon.jmail, .menu li.jmail .site-icon {
  background-image: url(/wp-content/uploads/2024/09/jmail.logo_.jpg); 
} 
.jmail-bg, .featured-apps.jmail-bg {
  background-color: rgba(var(--app-bg-jmail-rgb), .2);
}
.site-icon.universe-club, .menu li.universe-club .site-icon {
  background-image: url(/wp-content/uploads/2024/12/universe-club-icon.webp); 
} 
.universe-club-bg, .featured-apps.universe-club-bg {
  background-color: rgba(var(--app-bg-patolo-rgb), .2);
}



.box-section.type-1 {background-color: transparent;}

.review-section.column-wrap {
display: grid;
grid-template-columns: 1fr 1fr;
}
.review-section .card-review { width: 100%;}

.column-wrap {
  gap: 30px;
}
.column-wrap > div > img {
  border-radius: 8px;
}

.speech-wrap.interview {
  gap: 16px;
  margin-bottom: 0;
}
.speech-person {
  width: 15%;
  min-width: 54px;
  max-width: 64px;
  padding-left: .5em;
}
.sbp-l .speech-person {
  padding-left: 0;
  padding-right: .5em;

}
.speech-icon img {
  border: 0px;
  vertical-align: bottom;
}
.speech-wrap.interview div.speech-balloon {
  border: 0;
  padding: 0;
  max-width: inherit;
  border-radius: 0;
  margin-bottom: 1.8em;
}
.speech-wrap.interview .speech-balloon::before, .speech-wrap.interview .speech-balloon::after {
  display: none;
}

.cat-label {
  left: inherit;
  border: 0px solid #eee;
  font-size: .6em;
  color: var(--cocoon-white-color);
  background-color: rgba(var(--icon-rgb), 0.95);
  padding:5px 6px 5px;
  max-width: 70%;
  bottom: inherit;
  line-height: 1;
  font-weight: 700;
  top: .75em;
  right: .75em;
  border-radius: 30px;
}
.single .eye-catch .cat-label {
  display: none;
}

/* モバイルメニュー */


#mobile-toc-widget-wrap label .mobile-toc-button {
  background-color: var(--bg2);
  border: 1px solid rgba(var(--icon-rgb), 0.35);
}
#mobile-toc-widget-wrap .menu-trigger, #mobile-toc-widget-wrap .menu-trigger span {
  display: inline-block;
  transition: all .4s;
  box-sizing: border-box;
}

#mobile-toc-widget-wrap .menu-trigger {
  position: relative;
  line-height: 1;
}

#mobile-toc-widget-wrap .menu-trigger span {
  width: 24px;
  height: 24px;
  font-size: 16px;
}

#mobile-toc-widget-wrap {
  position: fixed;
  bottom: calc(2.75em + 28px);
  right: .75em;
  margin: 0;
  padding: 0;
  z-index: 1;
  display: none;
}


#mobile-toc-widget-wrap label .mobile-toc-button {
  width: auto;
  height: auto;
  border-radius: 0px;
  padding-left: 10px;
  transition: ease-out 0.3s;
  text-align: center;
  position: relative;
  z-index: 3;
  opacity: 1;
  display: flex;
  align-items: center;
  gap: 0px;
}

#mobile-toc-widget-wrap label .mobile-toc-button .mobile-toc-button-title {
  color: var(--text-sub);
  font-size: 12px;
  font-weight: bold;
  line-height: 36px;
  padding: 0px 0px;
  width: 52px;
  height: 36px;
  left: 0;
  right: 0;
  margin: auto;
  text-align: left;
  padding-left: 8px;
}

#mobile-toc-widget-wrap label:hover {
  background: #efefef;
}

#mobile-toc-widget-wrap input {
  display: none;
}

#mobile-toc-widget-wrap .mobile-toc-show {
  display: none;
}

#mobile-toc-widget-wrap input:checked~.mobile-toc-show {
  background: var(--theme-color);
  top: 0;
  left: 0;
  padding: 2.25em 1.75em 4em;
  visibility: hidden;
  position: fixed;
  width: 100%;
  height: 100%;
  display: block;
  /* animation: 0.3s fade-in;
  -webkit-animation: 0.3s fade-in; */
  overflow-y: scroll;
  display: none;
}

#mobile-toc-widget-wrap input:checked~.mobile-toc-show {
  display: flex;
  visibility: visible;
  align-items: center;
  justify-content: center;
}

#mobile-toc-widget-wrap label .mobile-toc-button {
  bottom: 0px;
  opacity: 1;
}

@-webkit-keyframes fadeIn {
  0% {
    display: none;
    opacity: 0;
  }
  1% {
    display: block;
    opacity: 0;
  }
  100% {
    display: block;
    opacity: 0.93;
  }
}

@keyframes fade-in {
  0% {
    display: none;
    opacity: 0;
  }
  1% {
    display: block;
    opacity: 0;
  }
  100% {
    display: block;
    opacity: 0.1;
  }
}

#mobile-toc-widget-wrap .widgettitle {
  text-align: center;
  margin: 0 0 1em;
  color: #f6a068;
  font-size: 1.1em;
  letter-spacing: 2px;
  font-weight: 700;
}

#mobile-toc-widget-wrap .mobile-toc-show .toc {
  border: none;
  width: 100%;
  margin: 0 !important;
  padding: 0 !important;
}

#mobile-toc-widget-wrap .mobile-toc-show .toc-title {
  padding: 0.6em 0 0.5em;
  border-radius: 6px 6px 0 0;
  color: var(--text-main);
  color: #FFF;
  background: repeating-linear-gradient(-45deg, #ff4f80, #ff4f80 10px, #ff6b8f 10px, #ff6b8f 20px);  
}

#mobile-toc-widget-wrap .mobile-toc-show .toc-title::after {
  display: none;
}
#mobile-toc-widget-wrap .mobile-toc-show .toc-content {
  display: block;
  visibility: visible;
  padding: .5em 1.5em 1.5em 2em;
  height: 57.5vh;
  opacity: 1;
  overflow: hidden;
  overflow-y: auto;
  background-color: var(--bg3);
}
#mobile-toc-widget-wrap .mobile-toc-show .toc ::marker {
  font-size: 0.9em;
}

#mobile-toc-widget-wrap .toc .toc-list>li {
  position: relative;
  margin-left: 15px;
  margin-right: 0px;
  padding-left: 0px;
  margin-bottom: 0.5em;
  margin-top: 0.5em;
  padding-bottom: 0px;
  font-size: 1.15em;
}

#mobile-toc-widget-wrap .toc a {
  font-size: 0.9em;
  font-weight: 700;
  line-height: 1.5;
  display: block;
}

#mobile-toc-widget-wrap .toc-list {
  padding: 0 !important;
  line-height: 1.3;
}

#mobile-toc-widget-wrap .toc_widget_list>li ol {
  margin-top: 5px;
  padding-left: 20px;
}

#mobile-toc-widget-wrap .toc-list ol {
  margin-top: 0.75em;
}
#mobile-toc-widget-wrap .toc-list ol>li {
  margin-bottom: 0.75em;
}

#mobile-toc-widget-wrap .toc-list>li>ol>li a {
  position: relative;
  text-decoration: none !important;
}

.body #mobile-toc-widget-wrap .toc-list>li ol li:last-child {
  margin-bottom: .75em;
}


.top_button_wrap {
  padding: 4% 0 8%;
  max-width: 580px;
  margin: 0 auto;
}


.article .heading2 {
  position: relative;
  padding: 1.5rem 0 0;
  font-size: 1.1rem;
  font-family: var(--font-bold);
  font-weight: 700;
  margin-bottom: 0;
}

.heading01 {
	display: inline;
	font-size: 26px;
	background-image: linear-gradient(rgba(0,0,0,0) 70%, rgb(252,81,133) 70%);
}
.heading02 {
  position: relative;
  padding: 0.7rem 1.0rem !important;
  border: 2px solid var(--bg1) !important;
  border-radius: 8px;
  background: var(--bg3);
  margin-bottom: 1em !important;
  font-size: 1.0em !important;
}

.heading02:before {
  position: absolute;
  bottom: -12px;
  left: 1.4em;
  width: 0;
  height: 0;
  content: '';
  border-width: 10px 9px 0 9px;
  border-style: solid;
  border-color: var(--bg1) transparent transparent transparent;
}

.heading02:after {
  position: absolute;
  bottom: -8px;
  left: 1.4em;
  width: 0;
  height: 0;
  content: '';
  border-width: 10px 9px 0 9px;
  border-style: solid;
  border-color: var(--bg3) transparent transparent transparent;
}
.heading03 {
	display: inline;
	font-size: 26px;
  padding: 0 !important;
  margin-bottom: 1.2em !important;
	background-image: linear-gradient(rgba(0,0,0,0) 70%, rgb(252,81,133) 70%);
}

.heading04 {
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
  font-family: var(--font-bold);
  font-weight: 700;
  padding: .4em 1.4em;
  font-size: .875em;
  line-height: 1.4;
}

.heading04::before,
.heading04::after {
	content: '';
	width: 4px;
	height: 34px;
	background-color: var(--key-color1);
  border-radius: 50px;
}

.heading04::before {
	margin-right: 1.75em;
	transform: rotate(-35deg)
}
.heading04::after {
	margin-left: 1.75em;
	transform: rotate(35deg)
}

.heading05, h2.wp-block-heading {
  position: relative;
  padding: 0em 0em 0.65em 2.25em !important;
  line-height: 1.4em;
  color: var(--text-keycolor2); /*文字色*/
  border-bottom: 4px solid var(--text-sub-heading);/*下線の設定*/
}

.heading05::before, h2.wp-block-heading::before {/*ピンクハートの設定*/

  font-family: "Font Awesome 5 Free"; /*アイドルフォントの設定*/

content: "\f004"; /*アイコンフォントの設定*/
position: absolute;
font-size: 0.9em; /*サイズ*/
left: 0.2em; /*アイコンの位置*/
top: -0.3em; /*アイコンの位置*/
color: #ff4f80; /*アイコン色*/
}

.heading05::after, h2.wp-block-heading::after {/*グレーハートの設定*/
font-family: "Font Awesome 5 Free"; /*アイコンフォントの設定*/
content: "\f004"; /*アイコンフォントの設定*/
position: absolute; 
font-size: 0.7em; /*サイズ*/
left: 1.3em; /*アイコンの位置*/
top: 0.6em; /*アイコンの位置*/
color: #d0c0c0; /*アイコン色*/
}

.heading06 {
	position: relative;
	padding-top: 50px;
	padding-bottom: 50px;
	font-size: 26px;
	text-align: center;
}

.heading06 span {
	position: relative;
	z-index: 2;
}

.heading06::before {
	content: attr(data-en);
	position: absolute;
	top: -20px;
	left: 50%;
	transform: translateX(-50%);
	color: rgba(224,66,114,0.2);
	font-size: 80px;
	font-style: italic;
}

.heading06::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translate(-50%) rotate(30deg);
	width: 1px;
	height: 40px;
	background-color: rgba(224,66,114,1);
}

/* .heading08 {
  margin-bottom: 0.75em !important;
  position: relative;
  padding: 2.0rem 1rem !important;
  text-align: center;
  display: flex;
  gap: 1.75em;
  flex-wrap: nowrap;
  align-items: center;
  font-size: 1em !important;
  justify-content: center;
}

.heading08:before,
.heading08:after {
  position: relative;
  left: 0;
  width: 25%;
  content: '';
  border-top: 2px solid var(--text-main);
} */

.article .head-d-t1, .article .head-d-t2 {
  position: relative;
  padding: 1.5rem 6.5rem 1.5rem 0;
}
.head-d-t1, .article .head-d-t1 {
  color: var(--text-keycolor2);
  font-size: 1.25em;
}

.head-d-t1::before {
  content: attr(data-en);
  display: block;
  color: var(--text-sub-heading);
  margin-bottom: .1em;
  font-size: 55%;
  position: absolute;
  padding: 6px 18px;
  background-color: var(--underline-red);
  top: 27%;
  border-radius: 50px;
  right: 0;
}
.head-d-t1:after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 10px;
  content: '';
  background-image: -webkit-repeating-linear-gradient(135deg, var(--text-sub-heading), var(--text-sub-heading) 1px, transparent 2px, transparent 5px);
  background-image: repeating-linear-gradient(-45deg, var(--text-sub-heading), var(--text-sub-heading) 1px, transparent 2px, transparent 5px);
  background-size: 7px 7px;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.head-d-t2::before {
	content: attr(data-en);
	display: block;
	color:  var(--text-sub-heading);
  margin-bottom: 0px;
	font-size: 0.78em;
}

.head-d-t2::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 80px;
  height: 4px;
	background-color:  var(--text-sub-heading);
}


.heading07, h4.wp-block-heading {
  position: relative;
  padding: 1.5rem 0;
  margin-bottom: 1em;
}
.heading07 {
  padding: 1.5rem 1.5rem !important;
}
.heading07:after, h4.wp-block-heading::after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 10px;
  content: '';
  background-image: -webkit-repeating-linear-gradient(135deg, var(--text-sub-heading), var(--text-sub-heading) 1px, transparent 2px, transparent 5px);
  background-image: repeating-linear-gradient(-45deg, var(--text-sub-heading), var(--text-sub-heading) 1px, transparent 2px, transparent 5px);
  background-size: 7px 7px;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}



.heading08 {
  position: relative;
  padding: 0 0;
  text-align: center;
  color: var(--text-main);
}

.heading08:before {
  position: absolute;
  top: calc(50% - 1px);
  left: 0;
  width: 100%;
  height: 8px;
  content: '';
  background-image: repeating-linear-gradient(45deg, var(--bg1) 0, var(--bg1) 1px, transparent 0, transparent 50%), repeating-linear-gradient(135deg, var(--bg1) 0, var(--bg1) 1px, transparent 0, transparent 50%);
  background-size: 8px 8px;
}

.heading08 > span {
  position: relative;
  padding: 0 1.5em;
  background: var(--bg2);
}

.heading09 {
  padding: 0.8em 0 0.8em 3.5em !important;
  margin-bottom: 0.4em !important;
  background-image: url(/wp-content/themes/cocoon-child-master/images/completed-task.svg);

  background-size: 56px;
  background-position: left 0.8em;
  background-repeat: no-repeat;
}

.heading09::before {
	content: attr(data-en);
	display: block;
	color: #e76e54;
  margin-bottom: .1em;
  font-size: 70%;
}

.heading09::after {
	content: '';
	display: block;
	width: 40px;
	height: 4px;
  margin-top: .3em;
	background-color: #e76e54;
}
.heading10 {
  background: -webkit-linear-gradient(#cff, #39f);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.heading11, .heading12 {
	position: relative;
	font-size: 1.3em !important;
  padding: 0.6em 0 !important;
  margin-bottom: 0 !important;
  text-wrap: nowrap;
}

.heading11::before {
  content: attr(data-number);
  display: inline-block;
  margin-right: 0.6em;
  color: #FFF;
  font-size: 24px;
  border: 0px;
  background-color: var(--key-color1);
  padding: 0 0;
  border-radius: 100px;
  text-align: center;
  min-width: 56px;
  line-height: 56px;
  padding: 0;
}
.heading11::after {
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  left: 32px;
  bottom: 10px;
  border-right: 16px solid var(--key-color1);
  border-top: 9px solid transparent;
  border-bottom: 9px solid transparent;
  transform: rotate(-20deg);
}

.column-wrap .heading11 {
  font-size: 1.1em !important;
}
.column-wrap .heading11::before {
  font-size: 1.3em;
  min-width: 48px;
  line-height: 48px;
  margin-left: -.5em;
}
.column-wrap .heading11::after {
  left: 18px;
  bottom: 10px;
}


.heading12::before {
	content: attr(data-number);
	display: inline-block;
	margin-right: 0.6em;
	color: var(--key-color1);
  font-size: 32px;
  border-bottom: 4px solid var(--key-color1);
}


.heading13 {
	position: relative;
	font-size: 1.2em !important;
  padding: 0.6em 0 !important;
  margin-bottom: 0.4em !important;
}

.heading13::before {
	content: attr(data-number);
	display: block;
	color: #d8be39;
  margin-bottom: 4px;
	font-size: 0.9em;
}

.heading13::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 80px;
	height: 4px;
	background-color: #d8be39;
}




.heading14 {
  margin-bottom: 0.75em !important;
  position: relative;
  padding: 2.0rem 2rem !important;
  border: 4px solid var(--text-main);
  text-align: center;
}

.heading14:before,
.heading14:after {
  position: absolute;
  left: 0;
  width: 100%;
  content: '';
  border-top: 4px dotted var(--text-main);
}

.heading14:before {
  top: 6px;
}

.heading14:after {
  bottom: 6px;
}
.heading15 {
  position: relative;
  padding: 1.5rem 1.5rem calc(1.5rem + 10px) !important;
  border: 2px solid #000;
}

.heading15:after {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 10px;
  content: '';
  border-top: 2px solid #000;
  background-image: -webkit-repeating-linear-gradient(135deg, #000, #000 1px, transparent 2px, transparent 5px);
  background-image: repeating-linear-gradient(-45deg, #000, #000 1px, transparent 2px, transparent 5px);
  background-size: 7px 7px;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.heading16 {
  position: relative;
  padding: 1rem .5rem;
}

.heading16:after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 6px;
  content: '';
  border-radius: 3px;
  background-image: -webkit-gradient(linear, right top, left top, from(#2af598), to(#009efd));
  background-image: -webkit-linear-gradient(right, #2af598 0%, #009efd 100%);
  background-image: linear-gradient(to left, #2af598 0%, #009efd 100%);
}
.heading17 {
  line-height: 60px;
  position: relative;
  height: 60px;
  margin: 2em 50px 1em;
  padding: 0 2rem;
  text-align: center;
  color: #fff;
  background: #fa4141;
}

.heading17:before,
.heading17:after {
  position: absolute;
  top: 0;
  display: block;
  height: 48px;
  content: '';
  border: 30px solid #fa4141;
}

.heading17:before {
  left: -40px;
  border-left-width: 15px;
  border-left-color: transparent;
}

.heading17:after {
  right: -40px;
  border-right-width: 15px;
  border-right-color: transparent;
}

.heading17 span {
  position: relative;
  display: block;
}
.heading18 {
  position: relative;
  padding: 1rem 2rem;
  text-align: center;
  color: #22ac38;
  border-radius: 0 10px 10px 10px;
  background: #e3f5d8;
}

.heading18:before {
  font-size: 85%;
  line-height: 1;
  position: absolute;
  top: -1.5em;
  left: 0;
  height: inherit;
  padding: 0.25em 1em;
  content: '\POINT';
  content: attr(data-en);
  color: #fff;
  border-radius: 6px 6px 0 0;
  background: #22ac38;
  display: inline-block;
}
.heading19 {
  position: relative;
  padding: 1rem 2rem;
  text-align: center;
  color: #0075a9;
  border-radius: 0 10px 10px 10px;
  background: #d8ecf5;
}

.heading19:before {
  font-family: 'Font Awesome 5 Free';
  font-size: 85%;
  line-height: 1;
  position: absolute;
  top: -1.5em;
  left: 0;
  height: inherit;
  padding: 0.25em 1em;
  content: '\f0a4  POINT';
  content: attr(data-en);
  color: #fff;
  border-radius: 6px 6px 0 0;
  background: #0075a9;
  display: inline;
}

.heading20 {
  position: relative;
  margin-bottom: 2em;
  padding: 1.0rem 1.25rem !important;
  border-radius: 10px;
  background: var(--bg1);
  font-size: 1.1em !important;
}

.heading20:before,
.heading20:after {
  position: absolute;
  content: '';
  border-radius: 50%;
  background: var(--bg1);
}

.heading20:before {
  bottom: -12px;
  left: 30px;
  width: 30px;
  height: 30px;
}

.heading20:after {
  bottom: -27px;
  left: 50px;
  width: 15px;
  height: 15px;
}

.information-box::before, .memo-box::before {
  z-index: 0;
  content: "";
  background-repeat: no-repeat;
  background-position: top center;
  background-size: contain;
  border-right: 0px;
  width: 30px;
  height: 30px;
  left: 20px;
  top: 1.0em;
  border: none;
  background-image: url(./images/information-icon.svg);
}
.memo-box::before {
  background-image: url(./images/lightbulb.svg);
}


.main .archive-title, .heading21 {
  position: relative;
  background: var(--alert-box-bg);
  padding: 1rem 1.5rem !important;
  text-align: center;
  display: block;
  margin: 0 auto;
  width: 80%;
}


.main .archive-title, h3.wp-block-heading {
  margin: 1em auto 2em;
}
.main .archive-title:before, .main .archive-title:after, .heading21:before, .heading21:after { 
	content:'';
	width: 20px;
	height: 40px;
	position: absolute;
	display: inline-block;
}
.main .archive-title:before, .heading21:before, h3.heading21:before {
	border-left: solid 3px var(--text-sub-heading);
	border-top: solid 3px var(--text-sub-heading);
	top:0;
	left: 0;
}
.main .archive-title:after, .heading21:after, h3.heading21:after {
	border-right: solid 3px var(--text-sub-heading);
	border-bottom: solid 3px var(--text-sub-heading);
	bottom:0;
  right: 0;
  left: inherit !important;
  background: inherit !important;
  height: 40px !important;
}

.heading22 {
  margin-top: 3.5em !important;
  position: relative;
  padding: 1.15rem 1.25rem !important;
  border: 3px solid var(--text-sub-heading)!important;
}
.heading22:before {
  position: absolute;
  top: 4px;
  left: 4px;
  width: calc(100% - 10px);
  height: calc(100% - 10px);
  content: '';
  border: 1px dotted var(--text-sub-heading);
}

.heading23 {
	position: relative;
	background: #f4fbfd;
	padding: 1rem 1.5rem;
	text-align: center;
}
.heading23:before, .heading23:after { 
	content:'';
	width: 20px;
	height: 40px;
	position: absolute;
	display: inline-block;
}

.heading23  {
  position: relative;
  padding: 1rem 2rem calc(1rem + 10px);
  background: #fff100;
}

.heading23:before {
  position: absolute;
  top: -6px;
  left: -6px;
  width: 100%;
  height: 100%;
  content: '';
  border: 2px solid #000;
}


.heading24, .article .heading24 {
 position:relative;
 background-color: var(--bg1) !important;
}
/*ズラす線の部分*/
.heading24::before {
 content: '';
 position: absolute;
 top: -5px;
 left: -5px;
 width: 100%;
 height: 100%;
 border: 1px solid currentColor !important;
 /*Lightning見出しデザイン設定のCSS対策*/
 margin: unset;
}

.heading25, .article .heading25 {
  position: relative;
  margin-top: 2.5em;
  margin-bottom: 1.0em;
  padding: 1.25rem .5rem 1.25rem 2.0rem;
  border-radius: 3px;
  background-image: -webkit-repeating-linear-gradient(135deg, var(--alert-box-bg), var(--alert-box-bg) 2px, transparent 2px, transparent 5px);
  background-image: repeating-linear-gradient(-45deg, var(--alert-box-bg), var(--alert-box-bg) 2px, transparent 2px, transparent 5px);
  background-size: 21px;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.heading25:after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 10px;
  height: 100%;
  content: '';
  background:var(--text-sub-heading);
}

h3.wp-block-heading {
  position: relative;
  margin-top: 2.5em;
  margin-bottom: 1.0em;
  padding: 1.25rem .5rem 1.25rem 2.0rem;
  border-radius: 3px;
  background: var(--alert-box-bg);
}
h3.wp-block-heading:after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 10px;
  height: 100%;
  content: '';
  background-image: -webkit-repeating-linear-gradient(135deg, var(--text-sub-heading), var(--text-sub-heading) 1px, transparent 2px, transparent 5px);
  background-image: repeating-linear-gradient(-45deg, var(--text-sub-heading), var(--text-sub-heading) 1px, transparent 2px, transparent 5px);
  background-size: 7px 7px;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.text-center {
  text-align: center;
}

.fukidashi01, .article .fukidashi01 {
  margin: 1.5em auto !important;
  position: relative;
  width: fit-content;
  /* font-size: 1em !important; */
  padding: 0.6em 1.5em !important;
  border: 1px solid var(--btn-color-red-shadow);
  border-radius: 5px;
  color: var(--alert-box-bg);
  background-color: var(--key-color-pink);
}
h3.fukidashi01 {
  font-size: 1em;
}

.fukidashi01::before {
  content: "";
  position: absolute;
  bottom: -6px;
  left: 50%;
  width: 15px;
  height: 15px;
  box-sizing: border-box;
  background-color:  #ff4f80; /* 背景色と同じ色を指定 */
  rotate: 135deg;
  translate: -50%;
}
.fukidashi01::after {
  content: "";
  position: absolute;
  bottom: -7px;
  left: 50%;
  width: 15px;
  height: 15px;
  box-sizing: border-box;
  border: 1px solid;
  border-color: var(--btn-color-red-shadow) var(--btn-color-red-shadow) transparent transparent;
  rotate: 135deg;
  translate: -50%;
}

.box-inner {
  border: 2px solid var(--bg1);
  padding: 5% 5% 5%;
  border-radius: 8px;
  max-width: 560px;
  margin: 0 auto 1.8em;
}
.box-inner p:last-child {margin-bottom: 0;}
.box-inner.negative {
  padding: 44px 5% 5%;
  margin-top: -44px;
}
.column-wrap .box-inner.negative {
  padding: 44px 5% 5%;
  margin-top: -44px;
}

.box-inner ul.circle, .box-inner ol.circle { margin-bottom: 0;}

.ad-label {
  margin-bottom: .25em;
  font-size: .75em;
  display: block;
  opacity: 0.5;
  color: var(--icon);
  padding-top: 8px;
}
.ad-wrap img {
  max-width: 300px;
  vertical-align: bottom;
}

.widget h2, .sidebar .widget-title {
  color: var(--icon);
  font-family: var(--font-bold);
  font-weight: 700;
  padding: 8px 0;
  margin: 16px 0 0;
  font-size: 1.1em;
    /* cursor: default;
    font-weight: bold;
    padding: 8px 12px;
    border-radius: 10px 10px 0 0;
    color: var(--text-main);
    background-color: var(--bg1);
    background-color: #ff5c92;
    background: repeating-linear-gradient(-45deg, #ff4f80, #ff4f80 10px, #ff6b8f 10px, #ff6b8f 20px);
    color: #FFF;
    text-align: center;
    border-radius: 8px 8px; */
}

.related-entries .related-entry-heading, .related-entries .comment-title {
  text-transform: uppercase;
  color: var(--text-heading);
  font-family: var(--font-bold);
  font-weight: 700;
  font-size: 1.15em;
  margin-bottom: 8px;
  padding: 0;
  /* letter-spacing: .2pt; */
  position: relative;
  overflow: hidden;
}
/* .related-entries .related-entry-heading:after, 
.related-entry-heading:after {
  background-color: var(--bg1);
  content: '';
  border-radius: 50%;
  margin-left: 15px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 8px;
  height: 8px;
  box-shadow: 20px 0 0 var(--underline-red), 40px 0 0 var(--text-heading), 60px 0 0 var(--bg1), 80px 0 0 var(--underline-red), 100px 0 0 var(--text-heading), 120px 0 0 var(--bg1), 140px 0 0 var(--underline-red), 160px 0 0 var(--text-heading), 180px 0 0 var(--bg1), 200px 0 0 var(--underline-red), 220px 0 0 var(--text-heading);
} */

.related-entries .related-entry-heading {
  font-size: 1.5em;
  font-family: var(--font-bold);
  font-weight: 700;
  margin-top: 1.8em;
  margin-bottom: .6em;
}

.rect-vertical-card .related-list .related-entry-card-thumb {
  margin: 0 auto;
  border-radius: 4px;
  overflow: hidden;
}

.body .widget:last-child, .body .ad-area {
  margin-bottom: 0;
}

.blogcard {
  padding: 4.5% 4.5% 3.5%;
  border-radius: 4px;
  line-height: 1.6;
  position: relative;
  color: var(--text-main);
  background-color: var(--bg1-on);
}
.blogcard-label {
  font-size: .7em;
  padding: 5px 1.4em;
  font-weight: 700;
  border-radius: 20px;
  top: -12px;
  background-color: var(--key-color1);
}
.blogcard-snippet {margin-top: 6px;}
.blogcard-thumbnail {
  width: 200px;
}
.blogcard-content {
  margin-left: 220px;
}
.ib-right .blogcard-content, .eb-right .blogcard-content {
  margin-right: 220px;
}

.blogcard-footer {
  clear: both;
  font-size: 13px;
  padding-top: 0.6%;
  position: absolute;
}
.ib-left .blogcard-footer {
  margin-left: 220px;
}

.error404 .article p {
  margin: 3em auto;
  text-align: center;
  display: block;
  padding: 0 40px;
}
img.not-found {
  max-width: 240px;
  margin: 6em auto 2em;
  display: block;
  width: 70%;
}

.widget-entry-cards .a-wrap {
  padding: 0px;
  line-height: 1.3;
  margin-bottom: 0;
}

.widget-entry-cards .a-wrap .widget-entry-card {
  display: flex;
  align-items: center;
  column-gap: 0px;
  font-size: .9em;
}
.sidebar .widget-entry-cards .a-wrap .widget-entry-card { 
  column-gap: 10px;
}
.widget-entry-card-content {
  margin-left: 0;
}
.widget-entry-cards figure {
  width: 240px;
  margin-top: 0;
  margin-right: 0;
}

/*目次*/
.widget { margin-bottom: 20px;}
.body .box-menus, .main .widget {
  margin-bottom: 0;
}
.box-menu {
  box-shadow: inset 1px 1px 0 0 var(--bg1), 1px 1px 0 0 var(--bg1);
  padding: 0.75em 1em;
}

.sidebar-scroll {
  top: 20px;
}

.sidebar .toc {
  padding: 0 0 0;
  width: 100%;
  margin-top: 0;
  margin-bottom: 0;
}

.sidebar .toc-title::after {
  /* display: none; */
}

.sidebar .toc-title {
  position: relative;
  font-size: 1.1em;
  cursor: default;
  font-weight: bold;
  border-radius: 0 0;
  background-color: transparent;
  color: var(--text-heading);
  font-family: var(--font-bold);
  margin-bottom: 10px;
  display: block;
  font-weight: 700;
  padding: 8px 0 12px;
  font-size: 1.15em;
  text-align: left;
}

.sidebar .toc-title:after {
  position: absolute;
  content: '' !important;
  width: 100%;
  height: 8px;
  left: 0;
  top: calc(100% - 8px);
  background: inherit;
  background-image: -webkit-repeating-linear-gradient(135deg, var(--text-sub-heading), var(--text-sub-heading) 1px, transparent 2px, transparent 5px);
  background-image: repeating-linear-gradient(-45deg, var(--text-sub-heading), var(--text-sub-heading) 1px, transparent 2px, transparent 5px);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.sidebar .toc .toc-list {
  line-height: 1.25;
}
.sidebar .toc .toc-list li:not(:last-child) {
  margin-bottom: 1.0em;
}
.sidebar .toc .toc-list ol {
  margin-top: .8em;
  margin-bottom: 1.2em;
}

.sidebar #toc-2 .toc-content {
  visibility: inherit;
  opacity: 1;
  padding: 1.25em 0.5em 1.25em 0.5em;
}
.sidebar #toc-2 .toc-content {
  font-size: .95em;
  background-color: var(--bg2);
  background-color: transparent;
  overflow-y: scroll;
  min-height: 200px;
  height: calc(100vh - 610px);
  max-height: 640px;
  border-radius: 0 0 10px 10px;
  box-shadow: inset 0 0 0 1px rgba(var(--icon-rgb), 0.35);
  box-shadow: inherit;
}

#toc-2 li.current>a, #toc-2 li.current>a:hover {background-color: #ff9; text-decoration: none;
  background: linear-gradient(transparent 70%, var(--underline) 0%);
}

.btn-l, .ranking-item-link-buttons a, .btn-wrap.btn-wrap-l > a {
  font-size: 1em;
}
.sidebar .ranking-item-link-buttons a {
  font-size: .8em;margin: 0 auto;
}
.ranking-items .ranking-item .ranking-item-link-buttons a::after {
  display: none;
}

/*開閉*/
.toggle-box {
  position: relative;
  overflow: hidden;
  height: 43.5vh;
  min-height: 360px;
  max-height: 440px;
  margin: .25em auto 2em;
  border-top-left-radius: 6px;
}
.toggle-box .toggle {
  position: absolute;
  cursor: pointer;
  width: 280px;
  height: 40px;
  text-align: center;
  display: block;
  color: var(--text-link);
  background-color: var(--bg3);
  border: 1px solid var(--key-color1);
  bottom: 30px;
  left: calc(50% - 140px);
  z-index: 3;
  border-radius: 50px;
  font-size: 14px;
  line-height: 40px;
  font-weight: 700;
}
.toggle-box.open {
  height: inherit;
  max-height: inherit;
}
.toggle-box:after {
  content: "";
  width: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  height: 40%;
  z-index: 2;
  background: #fff;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, var(--bg2) 45%);
}
.toggle-box.open .toggle, .toggle-box.open:after {
  display: none;
}

.txt-block {
  display: block;
}

.sidebar .item-ranking-box {
  overflow-x: auto;
  display: block;
  border-radius: 10px;
  box-shadow: inset 0 0 0 1px rgba(var(--icon-rgb), 0.35);
  background-color: var(--bg2);
}
.sidebar .ranking-items {
  line-height: 1.1;
  display: flex;
}
.sidebar .item-ranking-box .ranking-item {
  min-width: 100%;
}



a.new-entry-card-link.widget-entry-card-link.a-wrap {
  margin-top: 0px;
}
.sidebar .widget-entry-cards .a-wrap {
  padding: .8em .2em .8em .8em;
  padding: .5em 0;
  line-height: 1.4;
  margin-bottom: 0;
  border-bottom: 1px solid var(--bg7);
  background-color: transparent;
}
.widget-entry-cards:not(.large-thumb-on) .card-title {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}


.new-entry-cards.widget-entry-cards .a-wrap:last-child, .wp-block-group ul li:last-child a {
  border-bottom: 0;
}
.new-entry-cards.widget-entry-cards .a-wrap:last-child {
  border-color: var(--bg1);
  border-width: 0px;
  border-style: solid;
}


.breadcrumb.sbp-main-before, .breadcrumb.sbp-footer-before, .breadcrumb.pbp-main-before, .breadcrumb.pbp-footer-before {
  margin: 0 auto 0;
  padding: 1.5em 40px 0;
  width: auto;
  line-height: 1;
}
.breadcrumb.sbp-main-before + .content, .breadcrumb.pbp-main-before + .content {
  margin-top: 0px;
}
.sidebar .widget-entry-card {
  font-size: .85em;
  position: relative;
  display: flex;
  align-items: center;
  gap: .8em;
}
.card-thumb img {
  vertical-align: bottom;
}
.sidebar .widget-entry-cards figure {
  width: 42.5%;
  min-width: 120px;
  float: inherit;
  margin-top: 0;
  margin-right: 0;
  border-radius: 4px;
  overflow: hidden;
  margin-bottom: 0;
}
.sidebar .widget-entry-cards .widget-entry-card-content {
  margin-left: 0;
  flex: 1;
}

.sub-caption {
  font-size: 0.5em;
  padding: 0 .5em;
}

.ranking-item-img-desc, .nwa .ranking-item-description {
  margin-top: 0px; padding: 2px;
}
.item-ranking-box .ranking-item {
  display: flex;
  flex-direction: column;
  gap: 2px;
  color: var(--text-main);
  padding: 20px 16px;
  margin-bottom: 0;
  border: 0;
  justify-content: space-between;
  height: 200px;
}
.item-ranking-box .ranking-item .ranking-item-name-crown {
  display: none;
}

.item-ranking-box .ranking-item-link-buttons {
  display: flex;margin: 0;    gap: 4px;
}
.item-ranking-box .ranking-item-img-desc {
  order: 1;
  text-align: center;
}

.sidebar .item-ranking-box .title-name{
  display: flex;
  flex: 1;
  gap: 6px;
  flex-direction: column;
  line-height: 1.1;
}
.sidebar .ranking-item-name {
  padding: 0px 2px 0px;
}
.sidebar .ranking-item-rating {
  margin-top: -8px;
  padding: 2px;
}
.sidebar .item-ranking-box .title-name h3, .sidebar .item-ranking-box .title-name h4 {
  padding: 0px;
  margin: 0px 0;
  font-size: .9em;
  line-height: 1.1;
  font-family: var(--font-bold);
  font-weight: 700;
}
.sidebar .item-ranking-box .title-name span {
  font-size: 80%;display: block;color: var(--cocoon-google-plus-color);
}
.sidebar aside#block-7 {
    margin-bottom:0;
}
#sidebar-scroll .ad-area .ad-wrap {
  background-color: var(--bg7);
  height: 250px;
  overflow: hidden;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}
#sidebar-scroll .ad-area .ad-wrap img {
  max-width: 300px;
  vertical-align: bottom;
}

.card-item .title-name p span {
  font-size: 100%;display: block;color: var(--cocoon-google-plus-color);
}

.sidebar .item-ranking-box .title-name p {
  font-size: .75em;
}

.rating-star {
  color: #fac225;
  font-size: 1.2em;
}
 
.sidebar .item-ranking-box .rating-star {
  color: #fac225;
  font-size: 12px;
}
 


.rank-app-list {
  display: flex;
  gap: 0;
  flex-direction: column;
  margin-bottom: 0;
}
.rank-app-list .ranking-item {
  padding: 5%;
  border: 2px solid var(--cocoon-basic-border-color);
  border-radius: 12px;
}
.card-item {
  padding: 0;
  margin-bottom: 1.8em;
  border: 0px solid var(--cocoon-basic-border-color);
  /* border-radius: 12px;
  overflow: hidden; */
}
.rank-app-list .ranking-items .ranking-item-name-text .title-name, .card-item .title-name h3, .card-item .title-name p {
  margin: 0;
  line-height: 1;
  padding: 0;
  font-size: 1.35em;
}
.card-item .title-name p {margin-bottom: 0;}
.rank-app-list .ranking-items .ranking-item-name-text .title-name span {
  display: block;
}
.rank-app-list .ranking-items .ranking-item-name-crown {
  display: none;
}
.rank-app-list .ranking-items .ranking-item-name {
  padding: 4px 0px 4px;
}

.title-block {
  font-weight: bold;
  display: flex;
  gap: 16px;
  position: relative;
  align-items: center;
}
.card-item .title-block {
  line-height: 1.1;
  padding: 1.5em 0px 0;
  margin-bottom: 0.75em;
}


.card-item .title-block .title-name h3 + span, .card-item .title-name p + span {
  color: var(--cocoon-google-plus-color);
}

.card-item .title-block:before {
  content: "";
  position: absolute;
  left: 0px;
  top: 0px;
  height: 5px;
  width: 100%;
  border-radius: 50px;
  background-color: var(--bg1);
}
.card-item .title-block:after {
  content: "";
  position: absolute;
  left: 0px;
  top: 0px;
  height: 5px;
  width: 40%;
  border-radius: 50px 0 0 50px;
  background-color: rgb(255 79 128);
}


.title-block .site-icon {
  width: 64px;
  min-width: 64px;
  height: 64px;
  background-color: var(--bg1);
  border-radius: 12px;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.02);
}
.card-item .title-block .site-icon {
  width: 64px;
  min-width: 64px;
  height: 64px;
}


.stripe_bg {
  z-index: 0;
  position: relative;
  margin-bottom: 1.8em;
  padding: 7%;
  background-color: var(--bg2);
  border: 1px solid var(--bg1);
}
.stripe_bg .column-wrap {
  gap: 3.5%;  
}
.stripe_bg p {
  line-height: 1.5;
  font-size: .9em;
}
.stripe_bg:before {
  z-index: -2;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: repeating-linear-gradient(-45deg,var(--bg1),var(--bg1) 1px, var(--bg2) 1px, var(--bg2) 4px);
  content: ""
}

.stripe_bg:after {
  z-index: -1;
  position: absolute;
  top: 1em;
  right: 1em;
  bottom: 1em;
  left: 1em;
  background-color: var(--bg2);
  content: ""
}
p.heading-bold {
  font-weight: 700;
  line-height: 1;
  padding: 0 0 .7em;
  margin: 0 auto .7em;
  color: var(--key-color1);
  display: inline-block;
  position: relative;
}

.balloon, p.balloon {
  font-weight: 700;
  line-height: 1;
  padding: .7em 1.2em;
  margin: 0 auto 1.0em 0;
  color: #FFF;
  background-color: var(--key-color1);
  border-radius: 50px;
  font-size: .9em;
  display: inline-block;
  position: relative;
}
p.balloon:after {
  content: "";
  position: absolute;
  bottom: -16px;
  left: 30px;
  margin-left: 0;
  border: 9px solid transparent;
  border-top: 9px solid var(--key-color1);
}


/*アプリ情報*/
.error-message {
  font-size: .85em;
  font-weight: bold;
  text-align: center;
  width: 70%;
  margin: 3em auto;
}

.app-info p:not(.desc) {
  margin-bottom: 1em;
}

.body .column-wrap.app-info {
  margin-bottom: 1em;
  line-height: 1.6;
  row-gap: .8em;
}
.app-info p.desc{
  margin: 0 auto .8em;
  font-size: .9em;
}
.app-info p.balloon {
  margin: 1.5em auto .8em;
}
.app-info ul.circle {
  padding-left: 0;
  margin-bottom: 0.8em;
  font-weight: bold;
  font-size: .9em;
}

/*基本情報テーブル*/
.info-table, .article .info-table {
  line-height: 1.3;
  margin: 1.2em auto 2.4em;
}
.info-table thead {
  overflow: hidden;
}
.info-table thead h3 {
margin: 0 auto;
padding: 0;
}

.info-table thead th, .price-table thead th {
  font-size: .8em;
  padding: 0.75em 0;
  border: 0px;
  color: #FFF;
  background-color: var(--key-color1);
}

.price-table thead th {
  color: var(--alert-box-bg);
  background-color: var(--key-color-pink);
}
.price-table tbody th, .info-table.app-data-tbl tbody th {background-color: transparent;}
.price-table tbody th:nth-of-type(2n), .info-table.app-data-tbl tbody th:nth-of-type(2n), .price-table tr:nth-of-type(2n) {
  background-color: var(--alert-box-bg);
}

.info-table tbody th {
  min-width: 90px;
}
.info-table tbody th, .info-table tbody td {
  padding: 0.85em 1.0em;
  font-size: .85em;
  font-size: 14px;
}
.info-table tbody th, .price-table tbody th  {
  padding: 0.75em 0em;
  font-size: .85em;
}

.scrollable-table.stfc-sticky table:not(.wp-calendar-table) tr > *:first-child {
  background-color: var(--bg-table-th);
  border: 0px solid var(--cocoon-x-thin-color);
  color: var(--text-main);
}



.app-list-table a {
  text-decoration: none;
}

.btn-s {
  padding: 6px 6px;
  line-height: 1;
  font-size: .9em;
  margin: 0 0;
  border-radius: 50px;
  display: block;
  width: 100%;
  text-wrap: nowrap;
}
.btn-m, .btn-wrap.btn-wrap-m > a {
  padding: 10px 24px;
  font-size: .9em;
  border-radius: 50px;
  margin: 0 auto;
  display: block;
  max-width: 300px;
}

.app-list-table .sitetitle, .compare-table .sitetitle {
  margin-bottom: 0;
  text-decoration: none;
  padding: 3px 0 0;
  font-size: .85em;
  margin: 0;
  text-align: center; 
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

table th.center, table td.center, table .cost_list {
  text-align: center;
}

.info-table tbody td, .info-table tbody th, .pickup-table tbody td, .article .pickup-table tbody th {
  border: 0px solid var(--cocoon-x-thin-color);
}

.pickup-table, .article .pickup-table {
  line-height: 1.3;
  margin: 2.0em auto;
  max-width: 520px;
}
.pickup-table th, .pickup-table td {
  padding: 0px;
  border: 0px;
}

.pickup-table thead th {
  padding: 10px;
  border-radius: 4px;
  color: #FFF;
  background-color: #ff4f80;
  background: repeating-linear-gradient(
  -45deg, 
  #ff4f80, 
  #ff4f80 10px, 
  #ff6b8f 10px, 
  #ff6b8f 20px
  );
}

.info-table.app-data-tbl thead th, .wp-block-table .has-fixed-layout thead th {
  padding: 1.2em .5em;
  font-size: .85em;
  border-radius: 4px;
  background-color: var(--text-sub-heading);
  color: var(--alert-box-bg);
  line-height: 1.1;
}

.main figure.wp-block-table {
    border-radius: 8px;
    overflow: hidden;
    line-height: 1.2;
    box-shadow: 0 0 0 1px var(--bg1) inset;
}
.wp-block-table thead {
    border-bottom: 0px solid var(--text-sub-heading);
}
.wp-block-table .has-fixed-layout thead th {
    border-radius: 0px;
    border: 0px;
}
.wp-block-table td, .wp-block-table th {
    padding: .75em .5em;
}
.wp-block-table .has-fixed-layout td {
    text-align: center;
    border-left: 0;
    border-right: 0;
    padding: .75em .5em;
    border-color: var(--bg1);
}
.info-table.app-data-tbl th {
  /* background-color: var(--alert-box-bg); */
}

  .pickup-table tbody tr {
  display: flex;
  gap: 10px;
  background: transparent;
  justify-content: space-around;
}
.pickup-table tbody td {
  line-height: 1;
  text-align: center;
  width: calc(100% / 3);
}

.table-card .btn-area {
  display: flex;
  margin: 0;
  gap: 6px;
  justify-content: space-around;
  align-items: center;
}
.pickup-table .btn-area .btn {
  width: 100%;
  padding: 6px 2px;
}


.pickup-table tbody td p {
  margin: 0 auto;
}
.pickup-table .table-card {
  display: flex;
  margin-top: 1em;
  gap: 6px;
  padding: 12px 12px;
  background-color: var(--bg1);
  flex-direction: column;
  font-size: .85em;
  border-radius: 6px;
}
.pickup-table .table-card .bold { 
  font-family: var(--font-bold);
  font-weight: 700;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: var(--text-sub-heading);
}
.Dark .pickup-table .table-card .bold { 
  color: var(--bg6);
}

.pickup-table .table-card .sitetitle { 
  font-weight: 700;
  margin-bottom: 2px;
  font-size: .7em;
}


.pickup-table .btn {
  font-size: .75em;
  line-height: 1;
  border-radius: 50px;
}
.pickup-table img {
  width: 85%;
  vertical-align: bottom;
  max-width: 64px;
  border-radius: 12px;
}


.article .compare-gender {
  margin: 0 auto;
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-content: center;
  justify-content: center;
  border-radius: 12px;
  overflow: hidden;
  gap: .75em;
}
.article .compare-gender li {
  margin: 0;
  padding: 20px 0;
  min-height: 150px;
  align-self: stretch;
  text-align: center;
}
.article .compare-gender li span {
  display: inline-block;
  font-weight: 700;
  background: #FFF;
  padding: 2px 24px;
  border-radius: 50px;
}
.article .compare-gender li p {
  display: block;
  font-weight: 700;
  margin: 1em auto 0;
  font-size: 105%;
  padding: 0 10px;
  line-height: 1.3;
}
.compare-gender li.male {
  color: #FFF;
  background-color: var(--key-color1);
}
.compare-gender li.male span {
  color: var(--key-color1);
}
.compare-gender li.female {
  color: var(--text-sub-heading);
  background-color: var(--underline-red);
}
.compare-gender li.female span {
  color: var(--key-color2);
}

.price-table {
  border: 0;
  border-radius: 8px;
  overflow: hidden;
}
.price-table th {
  width: 30%; 
  min-width: 50px; 
  border: 0;
}
.price-table td {
  text-align: center;
  padding: 0.75em 1.0em;
  font-size: 14px;
  font-weight: 700;
  border: 0;
}
.info-table thead th:first-child {
  border-top-left-radius: 6px;
}

.info-table thead th:last-child {
  border-top-right-radius:6px;
}

.info-table tbody tr:last-child th {
  border-radius: 0 0 0 6px;
}
.info-table tbody tr:last-child td {
  border-radius: 0 6px 6px 0;
}

.rank-app-list .ranking-item-img-desc {
  gap: 20px;
  margin-top: 0em;
}
.rank-app-list .ranking-item-image-tag img {
  max-width: 180px;
  margin: 0;
}
.rank-app-list .ranking-item-image-tag {
  max-width: inherit;
  width: auto;
  padding: 0;
  margin-right: auto;
}
.rank-app-list .ranking-item-link-buttons {
  display: flex;
}


pre {
  background: #555;
  background: rgba(0, 0, 0, .7);
  color: #f8f9fa;
  font-size: 85%;
  line-height: 1.3;
  padding: 1.2em 1.7em;
  margin: .2em 0 2.2em;
  border-radius: 5px;
}

/*アプリテーブル*/
.app-list-table {
  line-height: 1.5;
  background-color: var(--bg2);
}
.app-list-table thead th {
  font-size: .675em;
  padding: 1.2em 0;
  border: 0px;
  color: #FFF;
  background-color: var(--key-color1);
}


.scrollable-table.stfc-sticky table:not(.wp-calendar-table).app-list-table thead tr > *:first-child {
  color: #FFF;
  background-color: var(--key-color1);
}

.compare-table thead th {
  background-color: inherit !important;
  border-bottom: 2px solid var(--bg1) !important;
}
.app-list-table.compare-table thead th a {
  color: var(--text-main);
}

.app-list-table thead {
  box-shadow: inherit;
  overflow: hidden;
}
.scrollable-table.stfc-sticky table:not(.wp-calendar-table) thead tr > *:first-child {
  color: var(--text-main);
}
.scrollable-table.stfc-sticky table:not(.wp-calendar-table) thead tr > *:last-child {
}

.app-list-table tbody {
  box-shadow: 0px 0 0 1px #CCC;
}
.app-list-table tbody td, .compare-table tbody td {
  padding: 16px 12px;
  border: 0px;
  border-bottom: 0px solid var(--cocoon-x-thin-color);
  white-space: normal;
  font-size: .85em;
  line-height: 1.4;
}
.app-list-table thead tr > *:first-child {
}


.app-list-table tbody {
  box-shadow: inherit;
}

.app-list-table tbody td:first-child {} 
.app-list-table tbody td:nth-child(-n+2)
{
}
/* .app-list-table tbody td:nth-child(-n+2) br
{
  display: none;
} */
.app-list-table tbody td p {
  margin: 2px auto;
  text-align: center;
}

.app-list-table tbody th, .compare-table tbody th {
  padding: 12px 12px;
  min-width: inherit;
  min-width: 70px;
  background-color: inherit;
  font-size: .8em;
  line-height: 1.3;
  border: 0px;
}
.app-list-table tbody th .site-icon img {

}
.sidebar .compare-table tbody th {font-size: .7em;}

.app-list-table .app-icon, .compare-table .app-icon {
  max-width: 80px;
  width: 54px;
  margin: 0 auto;
  margin-top: 0px;
  border-radius: 10px;
}
.sidebar .compare-table .app-icon {
  max-width: 44px;
}
.sidebar .compare-table tbody th {
  padding: 12px 8px;
  min-width: 80px;
}
.sidebar .compare-table tbody td {
  padding: 12px 8px;
  
}
.sidebar ul.circle li {
  padding-left: 18px;
  font-size: .95em;
}
.sidebar ul.circle li:before {
  top: .3em;
}


.rate-star {
  display: flex;
  font-size: 11px;
  min-width: inherit;
  text-wrap: nowrap;
}
.rate-star .fa-star {
  color: #fac225;
}
.app-list-table .rate-star {
  justify-content: center;
}

.compare-table {
  line-height: 1.6;
  border-radius: 6px;
  overflow: hidden;
  background-color: var(--bg2);
  color: var(--text-main);
}
table.compare-table :where(th, td) {
  border: 0px;
}


.compare-table thead th {
  padding: 10px 10px 10px;
  font-size: .85em;
  font-weight: 700;
  background-color: inherit;
  border-bottom: 2px solid var(--bg1);
}
.compare-table.p2 thead th {
  background-color: var(--alert-box-bg);
  color: var(--text-sub-heading);
}

.app-list-table th a, .compare-table th a{
text-decoration: none;
color: var(--text-main);
}
.app-list-table thead th a {
  color: #FFF;
}
.compare-table td p {
margin-bottom: 0;
}



ul.column-3 {
  list-style: none;
  margin: 0 auto 1.8em;
  padding-left: 0 !important;
  display: grid;
  gap: 20px;
  grid-template-columns: 1fr 1fr 1fr;
}
ul.column-3 h4 { font-size: 1.15em; margin: 0; padding: 4px 0; margin: 0.75em auto 0;}
ul.column-3 li img { float: left; margin: 1em 1em 1em 0;}
ul.column-3 { line-height: 1.3;}


ol.step-list, ol.wp-block-list {
  padding-left: 0;
  list-style: none;
  margin: 0 auto 1.8em;
  counter-reset: li_count;
}
ol.step-list li, ol.wp-block-list li {
  position: relative;
  margin: 0 auto 1em;
  padding: 0;
  padding-left: 4em;
}
ol.step-list li .column-wrap {
  margin-bottom: 0;
  padding: 0px 0 1.8em;
}
ol.step-list li h3 {
  padding: 12px 0px;
  margin: 0 auto .4em;
  font-size: 1.3em;
}

ol.step-list img.step-img-thumb {
  width: 90%;
  margin: 0 auto;
  display: block;
}


ol.circle {
  padding-left: 0;
  list-style: none;
  counter-reset: li_count;
}
ol.circle li {
  margin: 0 auto 1em;
  padding-left: 3.0em;
  display: block;
  gap: 1em;
  justify-content: flex-start;
  position: relative;
}
ol.circle.p2 li, ol.circle.p4 li {
  font-size: .9em;
  line-height: 1.5;
}


ol.step-list li::before, ol.circle li::before, ol.wp-block-list li::before {
  counter-increment: li_count;
  content: counter(li_count);
  display: inline-block;
  min-width: 26px;
  border-radius: 50px;
  height: 26px;
  line-height: 26px;
  padding: 0;
  vertical-align: middle;
  font-weight: 700;
  color: #FFF;
  background-color: var(--key-color1);
  font-size: .9rem;
  text-align: center;
}
ol.circle li::before, ol.wp-block-list li::before {
  z-index: 1;
  position: absolute;
  left: .25em;
}


ol.step-list.key2 li::before, ol.circle.key2 li::before {
  background-color: var(--key-color2);
}



ol.step-list li::before {
  display: inline-block;
  font-size: 1.5em;
  min-width: 2em;
  border-radius: 50px;
  height: 2em;
  line-height: 2em;
  position: absolute;
  left: 0;
}

ol.step-list li:not(:last-child):after, ol.circle.p2 li:not(:last-child)::after, ol.circle.p3 li:not(:last-child)::after, ol.circle.p4 li:not(:last-child)::after {
  content: "";
  display: inline-block;
  font-size: 1em;
  min-width: 4px;
  height: 100%;
  position: absolute;
  left: 0;
  border-left: 4px dotted var(--underline-blue);
  /* background-color: var(--underline-blue); */
  left: 1.4em;
  top: 0;
  z-index: -1;
}
ul.circle li:first-child, ol.circle li:first-child {margin-top: 0;}
ol.circle.p2, ol.circle.p4 {
  padding-left: 24px;
  /* border-left: 4px dotted #d8be39; */
  margin: .4em auto 2.8em 0;
  background-color: var(--bg7);
  padding: 40px;
  border-radius: 8px;
  position: relative;
}
ol.circle.p2 li::before, ol.circle.p4 li::before {
  background-color: #d8be39;
  z-index: 2;
  color: var(--theme-color);
}
ol.circle.p2 li:not(:last-child)::after, ol.circle.p4 li:not(:last-child)::after {
  border-left: 4px dotted #d8be39;
  z-index: 0;
  left: 1.0em;
  top: 1em;
}
ol.circle.p4 {
  background-color: var(--bg4);
}
ol.circle.p4 li::before {
  background-color: var(--key-color-pink);
  color: var(--theme-color);
}
ol.circle.p4 li:not(:last-child)::after {
  border-left: 4px dotted var(--key-color-pink);
}
ol.circle.p3 {
  margin: .4em auto 2.8em 0;
  position: relative;
}
ol.circle.p3 li::before {
  background-color: var(--text-sub-heading);
}
ol.circle.p3 li:not(:last-child)::after {
  border-left: 4px dotted var(--text-sub-heading);
  z-index: 0;
  left: .95em;
  top: 1em;
}

ol.circle li h4{ padding: 5px 0;
  margin-bottom: 0;
  font-size: 1.1em;}

ol.circle li p:last-child { margin-bottom: 0;}

ul.no-bullet, ul.no-bullet li {
  margin: 0 auto 1em;
  padding-left: 0 ;
  list-style: none;
}

ul.no-bullet h4 {font-size: 1em;}
ul.no-bullet .heading4 {
  background-color: var(--bg1);
  border-radius: 4px;
  padding: 0.75em 1.5em;
  margin: 0 auto 1em;
  border-left: 6px solid #CCC;
}

.info-list {
  color: var(--text-main);
  background-color: var(--bg2);
  border-color: var(--bg7);
  border-radius: 8px;
  overflow-y: auto;
  max-height: 180px;
  padding: .5% 2.5%;
  margin-bottom: 1.8em;
}
.info-list.is-style-frame-border {
  border: 2px solid var(--bg5);
}
.info-list-item-categorys .entry-category {
  margin: 0;
  white-space: nowrap;
  padding: 2px 6px;
  border-radius: 3px;
  border-width: 0px;
  color: var(--icon);
  background-color: var(--bg7);
  font-size: .9em;
}
.info-list-item {
  padding: 12px 0;
  font-size: .85em;
  line-height: 1.25;
  display: flex;
  align-items: center;
  gap: 1.5em;
  justify-content: space-between;
}
.info-list-item-content {
  margin-bottom: 0px;
  font-weight: 700;
}
.info-list-item-meta {
    opacity: 1;
    text-align: right;
}

.info-list-item-date {
  margin-right: 0px;
  color: var(--icon);
}
.info-list-item-categorys {
  margin-left: 12px;	
}

.more-link {
  background-color: var(--bg2);
  border: 2px solid var(--bg1);
  font-size: 0.95em;
  border-radius: 50px;
  margin: 0;
  padding: 1.0em 3.5em 1.0em 1.5em;
  text-decoration: none !important;
  font-weight: 700;
  line-height: 1;
  text-wrap: nowrap;
  position: relative;
  display: inline-block;
}
.more-link a { text-decoration: none;}
.more-link:after {
  /* 擬似要素で矢印アイコンをつくる */
  content: '';
  border: 0;
  border-top: solid 2px var(--text-link);
  border-right: solid 2px var(--text-link);
  display: inline-block;
  width: 8px;
  height: 8px;
  /* 矢印アイコンの位置を設定 */
  position: absolute;
  top: 50%;
  right: 1.4em;
  transform: translateY(-50%) rotate(45deg); /* rotate(45deg)で矢印を回転（向きを変更）させる */
}

ul.split, ol.split {
  display: grid;
  grid-template-columns: 1fr 1fr;
}

ul.circle li, ol.circle li, ul.wp-block-list li, ol.wp-block-list li {
width: 100%;
padding-left: 44px;
}
.article ul.featured-apps {
  display: flex;
margin: 0 auto;
  padding: 0;
  gap: 20px;
  list-style: none;
}

.featured-apps-block {
  padding: 1%;
  background-color: var(--bg2);
  border-radius: 10px;
}
.featured-apps {
  display: flex;
  padding: 0;
  gap: 15px;
  list-style: none;
  border-radius: 8px;
  margin: 0 0;
  overflow: hidden;
}
.featured-apps a, .article ul.list-apps li a { text-decoration: none;}
.article .featured-apps .sitetitle { text-align: center;    padding: 4px 0 0;
  font-weight: 700;
  font-size: .75em;
margin-bottom: 0;}


.article .featured-apps .site-icon {
  max-width: 164px;
  padding: 20px 20px 4px;
}
.article .featured-apps .site-icon img {
  border-radius: 10px;
}
.article .featured-apps .bottom-content {
  flex: 1;
  font-size: .85em;
  padding: 20px 12px 20px 0px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 2em;
}
.article .featured-apps .bottom-content .btn-area {
  display: flex;
  gap: 8px;
  font-size: .9em;
  flex-direction: column;
  flex: 1;
}
ul.list-apps {
  display: grid;
  grid-template-columns: repeat(7,1fr);
  padding: 0;
  gap: 12px;
  list-style: none;
  margin-bottom: 0;
  line-height: 1.2;
  font-size: .8em;
}
ul.list-apps li, .article ul.list-apps li {
margin: 0;
border-radius: 8px;
overflow: hidden;
font-size: .9em;
}

.article ul.list-apps li p {margin-bottom: 0;}
ul.list-apps li .sitetitle, .article ul.list-apps li .sitetitle {    text-align: center;
  color: var(--text-main);
  font-weight: 700;
  padding: 6px 0 2px;}
ul.list-apps .circle {
  padding: 0 12px 0 12px;
  line-height: 1.25;
  display: none;
}
ul.list-apps .circle li {    padding-left: 18px;}
ul.list-apps .circle li:not(:last-child) {
  margin-bottom: 10px;
}
ul.list-apps .circle li::before {
  top: .3em;
}
ul.list-apps .btn-area.mt0 {
  padding: 0 12px 16px 12px;
  gap: 10px;
  display: grid;
}

ul.circle, ul.wp-block-list {
  list-style: none;
  margin: 0 auto 1.8em;
  padding-left: 0;
  max-width: 520px;
}
ul.wp-block-list, ol.wp-block-list {max-width: inherit;}
ul.circle li, ul.wp-block-list li {
  position: relative;
  margin: 0.4em auto;
  padding-left: 24px;
}
ul.circle li:last-child, ul.wp-block-list li:last-child {margin-bottom: 0;}
ul.circle li::marker, ul.wp-block-list li::marker {
  display: none;
}
 
ul.circle li:before, ul.wp-block-list li:before {
  content: "";
  position: absolute;
  top: .5em;
  left: 0;
  width: 10px;
  height: 10px;
  background-color: var(--key-color1);
  border-radius: 50%;
  min-width: inherit;
}
ul.circle.key2 li:before, .color2 ul.wp-block-list li:before {
  background-color: var(--text-sub-heading);
}
ul.wp-block-list li:before {
  background-color: var(--key-color1);
}

span.answer {
  display: inline-block;
  color: #FFF;
  background: var(--key-color1);
  padding: 2px 12px;
  margin: 0 .75rem 0 0;
  font-size: .8em;
  font-weight: bold;
  border-radius: 4px;
}

.is-style-info-box, .info-box, .sp-info, .info {
  color: var(--text-main);
  background-color: var(--bg-table-th);
  border-color: var(--bg-table-th);
  padding: 30px;
  border-radius: 8px;
  margin-bottom: 1.8em;
}
.blank-box, .primary-box, .is-style-secondary-box, .secondary-box {
  padding: 1.5em;
  border-radius: 8px;
  margin-bottom: 1.8em;
}
.primary-box {
  background-color: var(--bg-table-odd);
  border-color: var(--bg-table-odd);
}

.primary-box {
  color: var(--text-main);
}
.blank-box.bb-blue {
  border-color: var(--key-color1);
}

.information-box, .alert-box , .memo-box, .info-box {
  font-size: .9em;
  line-height: 1.5;
}
.information-box p:last-child, .alert-box p:last-child { margin-bottom: 0;}

.information-box h4, .alert-box h3, .alert-box h4 {
  padding: 0.4em 0 0;
  margin-bottom: 0.8rem;
  color: #009efd;
}
.alert-box h4, .alert-box h3 {
  font-size: 1.4em;
  color: var(--text-alart-heading);
}


.header-container {
  background-color: var(--theme-color);
  box-shadow: 0 0 0px 1px rgba(var(--icon-rgb), 0.15);
}

.header-container .header-right {
  display: flex;
  align-items: center;
}

.header-container .navi {
  background-color: transparent;
  box-shadow: none;
  font-weight: bold;
}





.read-time {
  background-color: var(--y-100);
  color: var(--text-subcolor2);
  border: 0px;
  font-size: 0.8em;
  border-radius: 4px;
  margin: 0 auto;
  padding: .55em 1.5em;
}
.read-time .hourglass-half-icon {
  margin-right: 8px;
}

.entry-date {
  margin-left: 6px;
  font-weight: 500;
  letter-spacing: 0.05pt;
}
.list .entry-date {
  margin-left: 5px;
}

.entry-content .toc {
  background-color: transparent;
  border-radius: 0;
  border: 0px solid rgba(0, 0, 0, .1);
  z-index: 5;  
  margin: 0 auto;
  width: 90%;
}
.entry-content .toc ol.toc-list {
  max-width: 400px;
  margin: 0 auto;
}

.toc-title {
  font-size: 0.9em;
  font-weight: 700;
  padding: 12px 16px;
  background-color: var(--bg2);
  position: relative;
}
#toc .toc-title {
  box-shadow: inset 0 0 0 1px var(--text-alart-heading);
}
.toc-title:after, #mobile-toc-widget-wrap label::after, .go-to-top-button::before {
  position: absolute;
  top:2px;
  left:6px;
  content:"";
  height:100%;
  width:100%;
  z-index:-1;
  -webkit-transform: rotate(-1deg);
  -moz-transform: rotate(-1deg);
  background:rgba(var(--label-bg-shadow-rgb), 0.8);
  margin-left: auto;
}
#mobile-toc-widget-wrap label::after {z-index:1;}
.go-to-top-button::before {
  background-color: rgba(var(--app-bg-paddy-rgb), 0.5);
}
.toc-content {
  transition: inherit;
}
.toc-checkbox:checked~.toc-content {
  padding-top: 1.2em;
}

.toc a {
  font-weight: 700;
  padding-left: 0.15em;
}

ul.list-grid {
  list-style: none;
  margin: 1.5em 0 0;
  padding: 0;
  display: flex;
  gap: 20px;
  font-size: 0.95em;
  line-height: 1.5;
  flex-wrap: wrap;
}
ul.list-grid li {
  margin: 0;
  padding: 0;
  width: 47.5%;
}
ul.list-grid li h5 {
  font-size: 16px;
  display: inline-block;
  margin-bottom: 8px !important;
 }


.price-txt {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.price-txt .price-amount {
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  font-size: 1.6em;
  gap: 3px;
  line-height: 1;
  font-weight: bold;
  color: var(--key-color2);
}
.price-txt .price-amount span {font-size: 14px;font-weight: 500;}

.price-txt .heading-ballon {
  align-self: flex-start;
}

.price-box {
  background: var(--bg2);
  padding: 0;
  overflow: hidden;
  border-radius: 10px;
  box-shadow: 0 0 0 2px var(--bg1) inset;
  max-width: 600px;
  margin: 0 auto 3em;
}
.Dark .price-box {
  background: var(--bg7);
  box-shadow: inherit;
}

.price-box .price-inner {
  padding: 7%;
}
.price-box .price-inner .column-wrap {
  align-items: center;
  gap: 20px;
}
.price-box .price-inner .column-wrap .column-left {
  width: 40%;
}
.price-box .price-inner .column-wrap .column-right {
  flex: 1;
  width: auto;
}
.price-box .price-inner .column-wrap .column-left strong {
  position: relative;
  padding: 0.25rem 1.5rem;
  border: 1px solid var(--bg1);
  border-radius: 50px;
  background: var(--bg3);
  display: inline-block;
  font-size: .8em;
}


.price-box .price-box-ttl {
  margin-bottom: 0;
  color: #fff;
  background-color: #ff4f80;
  background: repeating-linear-gradient(-45deg, #ff4f80, #ff4f80 10px, #ff6b8f 10px, #ff6b8f 20px);

  text-align: center;
  padding: 1.25em 1.2em;
  font-size: 1em;
  line-height: 1;
}

div.speech-balloon p {
  font-size: .85em;
  line-height: 1.55;
}
.heading-ballon {
  background-color: var(--text-sub-heading);
  padding: 10px 1.5em !important;
  font-size: 0.85em !important;
  border-radius: 50px;
  margin-bottom: 1.25em !important;
  position: relative;
  font-weight: 700;
  display: inline-block;
  line-height: 1;
  color: var(--text-pink-sub);
}
.heading-ballon:after {
  content: "";
  position: absolute;
  bottom: -16px;
  left: 30px;
  margin-left: 0;
  border: 9px solid transparent;
  border-top: 9px solid var(--text-sub-heading);
}

.column-left.text-center {
  text-align: center;
}

.w100 {
  max-width: 100% !important;
}


.maste-box {
  position: relative;
  color: var(--text-keycolor3); /*文字色*/
  background-color: #fff;
  background: repeating-linear-gradient(-45deg, #edf5f4, #edf5f4 10px, #f6faf9 0, #f6faf9 20px);
  border-radius: 3px;
  box-shadow: inset 0 0 0 2px #8bc6ca;
  max-width: 600px;
  margin: 4.5em auto 2.5em;
  padding: 2.5em 2em 1.5em;
}
.maste-tape {
  line-height: 1;
  position: absolute;
  top: -1.45em;
  left: 1.0em;
  background-color: #FFF;
  border-left: 6px solid #8BC6CA !important;
  padding: 0.75em 1.2em !important;
  color: #009688;
  box-shadow: 0 0 0 1px #8BC6CA;
  transform: rotate(-3deg);
  font-weight: bold;
  font-size: 1em !important;
}
.maste-box p {
  padding: 15px 10px 10px 10px;
  color: #454545
}
.maste-box p:last-child {
  margin-bottom: 0;
}
.maste-box ul {
  list-style-type: disc;
  margin: 0px 0 0 1.25em;
  padding: 0;
}
.maste-box ul {
   font-weight: bold;
}

.stitch {
  color: #fff;
  padding: 1em;
  background: #f59fbb;
  border: 3px dotted #F7F9CC;
  border-radius: 1px;
  box-shadow: 0 0 0 6px #f59fbb;
  width: calc(100% - 12px);
  line-height: 1.4;
  margin: 0 auto;
}

.ribbon-1, .article h4.ribbon-1 {
  position: relative;
  /* display: inline-block; */
  display: flex;
  align-items: center;
  justify-content: center;
  height: 50px;
  line-height: 1.2 !important;
  padding: 0 1.15em !important;
  box-shadow: 0px -5px var(--underline-red), 0px 5px var(--underline-red);
  border-top: 2px solid var(--bg2);
  border-bottom: 2px solid var(--bg2);
  background-color: var(--underline-red);
  color: var(--text-sub-heading);
  margin-top: 5px !important;
  margin-bottom: 1.2em;
  font-size: 1.0em !important;
  font-family: var(--font-bold);
  font-weight: 700;
}

.ribbon-1::before,
.ribbon-1::after {
  position: absolute;
  top: -5px;
  width: 0px;
  height: 0px;
  border-color: transparent var(--bg2);
  border-style: solid;
  content: '';
}

.ribbon-1::before {
  left: 0;
  border-width: 30px 0px 30px 10px;
}

.ribbon-1::after {
  right: 0;
  border-width: 30px 10px 30px 0px;
}

.ribbon10 {
  display: inline-block;
  position: relative;
  height: 45px;
  text-align: center;
  box-sizing: border-box;
}

.ribbon10:before {
  content: '';
  position: absolute;
  width: 10px;
  bottom: -10px;
  left: -35px;
  z-index: -2;
  border: 20px solid #a5cff3;
  border-left-color: transparent;
  border-radius: 0 3px 3px 0;
}

.ribbon10:after {
  content: '';
  position: absolute;
  width: 10px;
  bottom: -10px;
  right: -35px;
  z-index: -2;
  border: 20px solid #a5cff3;
  border-right-color: transparent;
  border-radius: 3px 0 0 3px;
}

.ribbon10 h2, .ribbon10 h3, .ribbon10 h4 {
  top: 0px;
  display: inline-block;
  position: relative;
  margin: 0;
  padding: 0 24px;
  line-height: 45px;
  font-size: 21px;
  color: #008eff;
  text-shadow: 1px 1px 1px #FFF;
  background: -webkit-repeating-linear-gradient(-45deg, #b0daff, #b0daff 3px,#cfe8ff 3px, #cfe8ff 7px);
  background: repeating-linear-gradient(-45deg, #b0daff, #b0daff 3px,#cfe8ff 3px, #cfe8ff 7px);
}

.ribbon10 h3:before, .ribbon10 h4:before {
  position: absolute;
  content: '';
  top: 100%;
  left: 0;
  border: none;
  border-bottom: solid 10px transparent;
  border-right: solid 15px #7fafd9;
}

.ribbon10 h3:after, .ribbon10 h4:after {
  position: absolute;
  content: '';
  top: 100%;
  right: 0;
  border: none;
  border-bottom: solid 10px transparent;
  border-left: solid 15px #7fafd9;
}


.has-lines {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  text-align: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.has-lines:before,
.has-lines:after {
  content: '';
  -webkit-box-flex: 1;
  -webkit-flex-grow: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  height: 1px;
  background: #ccc;
  min-width: 20px;
  display: inline-block;
  vertical-align: middle;
}
.has-lines:before {
  margin-right: 20px;
}
.has-lines:after {
  margin-left: 20px;
}

.milky {
  font-family: "Arial Rounded MT Bold", "Helvetica Rounded", Arial, sans-serif;;
  text-transform: uppercase;
  display: block;
  font-size: 72px;
  color: #f1ebe5;
  text-shadow: 0 8px 9px #c4b59d, 0px -2px 1px #fff;
  font-weight: bold;
  letter-spacing: -4px;
  text-align: center;
  background: linear-gradient(to bottom, #ece4d9 0%,#e9dfd1 100%);
  position: absolute;
  padding: 20px 70px;
  top: 20%;
  left: 50%;
  transform: translate(-50%,-50%);
  border-radius: 20px;
}

.box-type-1 {
	border: 10px solid 
#fcf0f1;	/* 内側の線の太さ・種類・色 */
	margin: 10px; /* 外側の余白 */
	padding: 10px; /* 内側の余白 */
	position: relative;
	z-index: 0;
}
.box-type-1:before {
	border: 1px solid 
#f5d5da;	/* 外側の線の太さ・種類・色 */
	content: '';
	display: block;
	position: absolute;
	top: -10px;
	bottom: -10px;
	left: -10px;
	right: -10px;
	z-index: -1;
}

.box-type-2 {
	border: 5px solid 
#eee;	/* 線の太さ・種類・色 */
	margin: 10px; /* 外側の余白 */
	padding: 10px; /* 内側の余白 */
	position: relative;
	z-index: 0;
}
.box-type-2:before {
	border-top: 5px solid 
#f0b8bf;	/* 一部だけ異なる線の太さ・種類・色 */
	border-left: 5px solid 
#f0b8bf;	/* 一部だけ異なる線の太さ・種類・色 */
	content: '';
	display: block;
	position: absolute;
	top: -5px;
	left: -5px;
	width: 20px;
	height: 20px;
	z-index: 1;
}

.box-type-3{
	background-color: #F6D4D8;  /* 背景色 */
	border-radius: 5px;
	margin: 20px 5px; /* 外側の余白 上下・左右 */
	padding: 30px 20px 20px 20px; /* 内側の余白 上・右・下・左 */
	position: relative;
	z-index: 0;
}
.box-type-3:before{
	border: 1px solid #fff; /* 白い実線 */
	border-radius: 5px;
	content: '';
	display: block;
	margin: 4px;
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	z-index: -1;
}
.box-type-3:after{
	background-color: rgba(249,223,213,0.9);  /* マステ背景色 */
	background-image: radial-gradient(#fff 20%, transparent 0), radial-gradient(#fff 20%, transparent 0); /* 水玉の色 */
	background-position: 0 0, 8px 8px;  /* 水玉の距離 */
	background-size: 15px 15px; /* 水玉の大きさ */
	border-left: 2px dotted rgba(0,0,0,0.1);
	border-right: 2px dotted rgba(0,0,0,0.1);
	box-shadow: 0 0 5px rgba(0,0,0,0.2);
	content: 'TITLE';
	display: block;
	padding: 5px 20px;  
	text-align: center;
	position: absolute;
	top: -10px;
	left: 20px;
	transform: rotate(-3deg);
	-moz-transform: rotate(-3deg);
	-webkit-transform: rotate(-3deg);
	-o-transform: rotate(-3deg);
}

.box-type-4{
	background-color: #fff;	/* 背景色 */
	border: 2px solid #f3cbd0;	/* 線の太さ・種類・色 */
	border-radius: 5px;
	margin: 40px 5px 5px 20px;	/* 外側の余白 上・右・左・下 */
	padding: 25px 20px 10px 20px;	/* 内側の余白 上・右・左・下 */
	position: relative;
}
.box-type-4:before{
	background-color: #ef858c;	/* 吹き出し背景色 */
	border-radius: 5px;
	color: #fff;	/* 吹き出し文字色 */
	content: 'TITLE';
	padding: 5px 20px;
	position: absolute;
	left: -10px;
	top: -20px;
}
.box-type-4:after{
	border-top: 12px solid #ef858c;		/* 吹き出し三角部分の色 */
	border-right: 12px solid transparent;
	border-left: 12px solid transparent;
	content: '';
	position: absolute;
	top: 10px;
	left: 15px;
}

.box-type-5{
	margin: 5px 10px;	/* 外側の余白 上下・左右 */
 	padding: 20px;	/* 内側の余白 */
	position: relative;
	z-index: 0;
}
.box-type-5:before{
	background: repeating-linear-gradient(-45deg, #f5d5da, #f5d5da 5px, #fcf0f1 0, #fcf0f1 10px); /* ストライプの色 */
	content: '';
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	z-index: -2;
}
.box-type-5:after{
	background: #fff; /* 背景色 */
	content: '';
	position: absolute;
	top: 10px;	/* ストライプ部分の太さ・上 */
	bottom: 10px;	/* ストライプ部分の太さ・下 */
	left: 10px;	/* ストライプ部分の太さ・左 */
	right: 10px;	/* ストライプ部分の太さ・右 */
	z-index: -1;
}

.box-type-6{
	background-color: #fff;	/* 背景色 */
	border: 1px solid #ccc; /* 線の太さ・種類・色 */
	box-shadow:1px 1px 6px 0px #ccc;
	-moz-box-shadow:1px 1px 6px 0px #ccc;
	-webkit-box-shadow:1px 1px 6px 0px #ccc;
	-o-box-shadow:1px 1px 6px 0px #ccc;
	margin: 20px 5px; /* 外側の余白 上下・左右 */
	padding: 30px 20px 20px 20px; /* 内側の余白 上・右・下・左 */
	position: relative;
	z-index: 0;
}
.box-type-6:after{
	background-color: #d9ccb3; /* マステ部分の色1 */
	background-image: linear-gradient(45deg, #dfd4be 25%, transparent 25%, transparent 75%, #dfd4be 75%, #dfd4be), linear-gradient(45deg, #dfd4be 25%, transparent 25%, transparent 75%, #dfd4be 75%, #dfd4be); /* マステ部分の色2 */
	background-position: 0 0, 12px 12px;
	background-size: 24px 24px;
	border-left: 2px dotted rgba(255,255,255,0.9);
	border-right: 2px dotted rgba(255,255,255,0.9);
	box-shadow: 0 0 5px rgba(255,255,255,0.5);
	content: 'TITLE';
	display: block;
	margin: 0 0 10px 0;
	padding: 5px 20px;
	color: #fff;  /* マステ部分文字色 */
	text-align: center;
	position: absolute;
	top: -10px;
	left: 20px;
	transform: rotate(-3deg);
	-moz-transform: rotate(-3deg);
	-webkit-transform: rotate(-3deg);
	-o-transform: rotate(-3deg);
}

.bx-design13 {
  margin: 2.0rem auto;
  border-radius: 6px;
  padding: 5% 5% 4%;
  /* max-width: 100%; */
  max-width: 560px;
  border: 2px solid var(--key-color1);
  position: relative;
}
.bx-design13-ttl {
  position: absolute;
  top: -0.85em;
  left: .85em;
  color: var(--key-color1);
  background-color: var(--bg2);
  padding: 0 0.65em;
  font-weight: 700;
  margin-bottom: 0 !important;
}

.bx-design13.color2 {
  border: 2px solid var(--key-color2);
}
.bx-design13.color2 .bx-design13-ttl {
      color: var(--text-sub-heading);
      
}

.bx-design13.color2 ol.circle li::before, ol.wp-block-list li::before {
  background-color: var(--underline-red);
      color: var(--text-sub-heading);
}

.bx-design13 ul, .bx-design13 ul li:last-child, .bx-design13 ol, .bx-design13 ol li:last-child {
  margin-bottom: 0;
}

.card-item .bx-design13 {
  margin: 1.8em auto 0.8em;
  padding: 6% 6%;
}

.slide-list {
  display: grid;
  gap: 1em;
  grid-template-columns: 1fr 1fr;
}
.sitecard {
  display: flex;
  gap: 10px;
  line-height: 1.4;
  flex-direction: column;
  justify-content: space-between;
  box-shadow: inset 0 0 0 2px var(--bg1);
  border-radius: 8px;
  background-color: var(--bg2);
  max-width: 560px;
  margin: 10px auto;
  width: 100%;
}
.sitecard.small {
  padding: 12px;
  box-shadow: none;
  margin: 0 auto 1.0em;
  align-items: center;
  background-color: var(--bg7);
  color: var(--text-main);
}
.sitecard.small .site-icon {
  max-width: 110px;
}

.entry-content .sitecard.small .top-content {
  gap: 20px;
  margin-top: 0;
}
.sitecard.bottom-large {
  margin: 0em auto 2.5em;
  padding: .25em .5em .5em;
  max-width: inherit;
  border: 0px;
  box-shadow: inherit;
  padding: 0;
  border-radius: inherit;
}
.sitecard.bottom-large .top-content {
  line-height: inherit;
  margin: 0em 0;
  gap: 1.0em;
}
.sitecard.bottom-large .site-icon {
  max-width: 200px;
}
.sitecard.bottom-large .site-icon img {
border-radius: 20px;
}
.sitecard.bottom-large .site-icon a {
  padding: 0 1em 1em;
}
.sitecard.bottom-large .site-content {
  flex: 1;
}
.sitecard .site-content .desc {}
.box-section.type-1 .sitecard {

  box-shadow: inset 0 0 0 1px var(--bg1);

}

.sitecard .top-content {
  display: flex;
  flex-direction: row;
  gap: 0;
  line-height: 1;
  justify-content: flex-start;
  align-items: center;
  margin-top: 1.5em;
}

.sitecard .sitetitle {
  padding: 0;
  font-size: 1.2em;
  line-height: 1.25;
  font-family: var(--font-bold);
  font-weight: 700;
  margin-bottom: 0;
  color: var(--text-main);
}
.sitecard .sitetitle + span {
  font-weight: bold;
  font-size: 95%;
  display: block;
  color: var(--cocoon-google-plus-color);
}
.sitecard .site-desc {
  padding: 0 2em;
  font-size: 85%;
  line-height: 1.5;
  color: var(--text-main);
}

.sitecard .site-icon {
  max-width: 164px;
}
.widget .sitecard .site-icon {
  max-width: 128px;
}
.sidebar .widget .sitecard .site-icon {
  max-width: 96px;
}
.sitecard .site-icon img {
  border-radius: 12px;
}

.sitecard .site-icon a {
  display: block;
  padding: 0 .8em 0px 1.8em;
}
.sitecard .bottom-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: .5em;
}
.sitecard .bottom-content .btn-area, .app-info .btn-area, .compare-table .btn-area {
  display: flex;
  margin: 0;
  gap: 10px;
  justify-content: space-around;
  align-items: center;
  width: 100%;
  padding: 8px 1.8em 1.8em;
}
.compare-table .btn-area {padding: 8px 0px 0px;    max-width: 420px;}
.app-info .btn-area {padding: 16px 0px; }

.sidebar .sitecard .top-content {
  margin-top: 1.2em;
}
.sidebar .sitecard .bottom-content .btn-area {
  padding: 0px 1.2em 1.2em;
}
.sidebar .sitecard .site-desc {
  padding: 0 1.4em;
}
.sidebar .sitecard .bottom-content .btn-area .btn {
  font-size: .85em;
  padding: 6px 12px;
}
.sidebar .site-icon a {
  display: block;
  padding: 0 .8em 0px 1.2em;
}

.sitecard .bottom-content .btn-area .btn, .app-info .btn-area .btn {
  width: 100%;
  padding: 8px 12px;
}

.btn-area .btn, .ranking-item-link-buttons a {
  font-weight: 700;
}

.navi-footer-in > .menu-footer {
  align-items: center;
}

.footer .box-menus {
  /* border-radius: 8px;
  overflow: hidden; */
}

.footer .box-menu-icon {
  color: var(--key-color-pink);
  font-size: 32px;
}

.footer .box-menu-icon .fas {margin: 0 auto;}
.footer .box-menu-icon .fas:before {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;

    text-indent: -9999em;
    background-color: var(--icon);
    content: "";
    left: 6px;
    top: 6px;
  display: block;
    margin: 0;
    width: 48px;
    height: 48px;
    border-radius: 0px;
    background-color: transparent;
    background-color: var(--icon);
}

.footer .box-menu-icon .fa-book:before {
  background-image: url(./images/dictionary-icon.svg);
  background-image: none;
    -webkit-mask: url(./images/dictionary-icon.svg) no-repeat center center / contain;
    mask-image: url(./images/dictionary-icon.svg);

}
.footer .box-menu-icon .fa-question:before {
    background-image: url(./images/questions-icon.svg);
    background-image: none;
    -webkit-mask: url(./images/questions-icon.svg) no-repeat center center / contain;
    mask-image: url(./images/questions-icon.svg);
    width: 42px;

}

.footer-bottom-logo img.site-logo-image {
  display: none;
}
.footer-bottom-logo .site-name-text {
  display: block;
}
.footer-bottom-logo .site-name-text:before {
  background-size: cover;
  background-position: left;

  background-repeat: no-repeat;
  text-indent: -9999em;
  background-color: var(--icon);
  content: "";
  display: block;
  margin: 0;
  width: 160px;
  height: 108px;
  border-radius: 0px;
  background-color: transparent;
}
.footer-bottom-logo .site-name-text:before {
  background-image: url(./images/papa-logo-l-color.svg);
}


.footer .box-menu {
  min-height: inherit;
  padding: 0.75em 1em;
  box-shadow: inherit;
}
.footer .box-menu .box-menu-label {
  font-size: .9em;
  font-weight: 700;
}

.footer .box-menu:first-child {
  border-radius: 8px 0 0 8px;
}
.footer .box-menu:last-child {
  border-radius: 0 8px 8px 0;
}

.footer-bottom.fnm-text-width .menu-footer li a {
  padding: 0 12px;
  font-size: 1em;
}
.navi-footer-in a:hover {
  background-color: var(--bg7);
}

.navi-footer-in > .menu-footer li {
  border-left: 0px solid var(--cocoon-thin-color);
}
.navi-footer-in > .menu-footer li:last-child {
  border-right: 0px solid var(--cocoon-thin-color);
}

.help-box {
  background-color: var(--bg2);
  border-bottom: .1rem solid var(--bg1);
  padding: 0 0;
  margin: 0 2.5%;
}
.help-box>dl {margin-bottom: 0;}
.help-box>dl>dd, .help-box>dl>dt, .terms-box>dl>dd, .terms-box>dl>dt {
  font-size: 1.0rem;
  line-height: 1.6em;
  border-top: .1rem solid var(--bg1);
  border-left: .1rem solid var(--bg1);
  border-right: .1rem solid var(--bg1);
}
.help-box>dl>dt, .terms-box>dl>dt {
  font-weight: 700;
  background-color: var(--bg1);
  padding: .7rem 1rem;
}
.help-box>dl>dd, .terms-box>dl>dd {
  padding: 1rem;
}
.article .help-box dd {
  margin-left: 0px;
}

.body .blogcard-type { margin-top: 2.5em;margin-bottom: 2.5em;}

#ft-fixed-bar-sp {display: none;}


.headsp-bn {
  align-items: center;
  background: linear-gradient(90deg,#111,#615b52 49%,#111);
  display: flex;
  height: 40px;
  justify-content: center;
  position: relative;
  width: 100%;
  z-index: 10
}

.headsp-bn:after, .headsp-bn:before {
  border-bottom: 1px solid #716858;
  content: "";
  height: 0;
  width: 60px
}

.headsp-bn .content {
  align-items: center;
  display: flex;
  justify-content: center;
  padding: 0 10px
}

.headsp-bn .content p {
  -webkit-text-fill-color: transparent;
  background: linear-gradient(90deg,#fff2e6,#f8c49c);
  -webkit-background-clip: text
}

.headsp-bn .content:after, .headsp-bn .content:before {
  color: #716858;
  content: "·";
  font-size: 30px;
  width: 20px
}

.headsp-bn .content:after {
  text-align: right
}

.headsp-bn .content .sub-btn {
  align-items: center;
  background: linear-gradient(90deg,#ffecda,#f8c9a5);
  border-radius: 16px;
  color: #261a05;
  cursor: pointer;
  display: flex;
  font-size: 14px;
  font-weight: 700;
  gap: 6px;
  height: 28px;
  margin-left: 15px;
  padding: 0 10px
}

.headsp-bn .content .sub-btn .iconfont, .headsp-bn .content .sub-btn svg {
  font-size: 20px
}

.headsp-bn .icon-close, .headsp-bn>svg {
  color: #3c3a36;
  cursor: pointer;
  font-size: 14px;
  position: absolute;
  right: 20px;
  top: 13px
}

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/

@media screen and (max-width: 1219px) {

  .sidebar {
    margin: 0 0;
    padding: 20px 20px 60px;
    width: 340px;
  }
}

/*1023px以下*/
@media screen and (max-width: 1023px) {
  /*必要ならばここにコードを書く*/
  .wrap { padding: 0 0px;}
  main.main, div.sidebar {
      display: block;
      margin: 0px;
      width: auto;
      border-radius: 0px;
  }
  .footer-widgets > div {
    padding: 5% 6.5%;
  }
  .single .main {
    border-radius: 0px 0px 0px 0px;
  }
  .logo-footer {
    margin: 16px auto;
  }
  .list {
    margin: 0px 40px;
  }
  .main .archive-title {
    padding: 2em 0px 2em;
    font-size: 1.25em;
  }
  .navi-footer-in > .menu-footer {
    width: 90%;
    margin: 0 auto;
}

  /* 
  ol.circle.p2 {
    background-color: var(--bg7);
  }
  .Dark  ol.circle.p2 {
    background-color: var(--bg3);
  }
  ol.circle.p2 li::before {
    color: var(--bg3);
  } */

  .header-container-in.hlt-top-menu {
    padding: 0px 0px;
  }

  /* .bx-design13-ttl {
    background-color: var(--bg3);
  } */
  .content {
    background-color: var(--bg7);
  }
/* 
  .ribbon-1::before, .ribbon-1::after {
    border-color: transparent var(--bg3);
  }
  .article h4.ribbon-1 {
    border-color: var(--bg3);
  } */


  .header-container-in.hlt-top-menu .header-right {
    display: none;
  }
  .breadcrumb.sbp-main-before, .breadcrumb.sbp-footer-before, .breadcrumb.pbp-main-before, .breadcrumb.pbp-footer-before {
    background-color: var(--theme-color);
    padding: 1em 20px 1em;
  }

  .mobile-menu-buttons .menu-button {
    padding: 0 20px;
  }
  .mobile-menu-buttons .search-menu-button.menu-button {
    padding: 0 8px;
  }
  .ModeButton {
    padding-right: 0;
    padding-left: 0;
  }
  .ModeButton button {
    width: 52px;
    height: 48px;
  }
  .ModeButton button:before {
    left: 8px;
    top: 14px;
  }
  .breadcrumb {
    overflow-x: auto;
    width: 100%;
    white-space: nowrap;
  }

  /*フッター*/
  .go-to-top {
    right: .75em;
    bottom: 1.5em;
  }
  .sidebar .item-ranking-box, .sidebar .toc {display: none;}
  #sidebar-scroll .ad-area .ad-wrap img {
    max-width: 100%;
  }
  #sidebar-scroll .ad-area .ad-wrap {
    height: inherit;
  }

  .home .widget_popular_entries .widget-entry-cards::-webkit-scrollbar,   ul.list-apps::-webkit-scrollbar {
    display: none;
  }

}


/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/


  .home .main {
    margin-top: 1em;
  }
  .home .entry-content {
    background-color: var(--bg2);
  }
  .footer-widgets {
    display: block;
  }
  ul#menu-applist, .footer .menu {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
  }

  .article h2 {
    font-size: calc( 1.25em + .25vw);
  }
  .article h4, .article h5, .article h6 {
    font-size: calc( 1.05em + .25vw);
  }


  .container .column-wrap {
    gap: 0;
    row-gap: 0.8em;
  }
  .review-section.column-wrap {
    gap: 1em;
  }

  .header-container-in.hlt-top-menu {
    flex-direction: row;
  }
  .price-box .price-inner .column-wrap .column-left {
    width: 100%;
  }

  .article .entry-content .column-wrap.column-mobile>div.column-left {
    width: 38vw;
  }
  
  .article .entry-content .column-wrap.column-mobile>div.column-right {
    flex: 1;
  }
  .blogcard-footer {
    font-size: 12px;
  }

  .blogcard-thumbnail {
    width: 35vw;
    min-width: 130px;
  }
  .ib-right .blogcard-content, .eb-right .blogcard-content {
    margin-right: 38vw;
  }
  .blogcard-content, .ib-left .blogcard-footer {
    margin-left: 38vw;
  }

  .home .widget_info_list {
    padding: 0 0px;
  }

  
  /*円グラフ*/
.chart {
  width: 30vw;
  height: 30vw;

}

.chart-inner {
  width: 21.5vw;
  height: 21.5vw;
}
.chart-inner p {padding: 22px 10px;font-size: 1.1em;}
.chart-inner p span {
  font-size: 70%;
  width: 90%;
  padding: 3px 5px;
}

  .home #popular_entries-2 .widget-title, .home .widget_popular_entries .widget-title, .home .main .widget-title {
    font-size: 1.1em;
    padding: 12px 20px 6px;
  }
.home .main .widget-title {
    background-color: var(--bg2);
  }

  .home .main .textwidget.custom-html-widget {
    padding: 0 20px 20px;
    margin-bottom: 1.8em;
    background-color: var(--bg2);
  }
  
  .home .widget_popular_entries .widget-entry-cards, .home .main .content-top .textwidget.custom-html-widget {
    padding: 0px 20px 0px;
    column-gap: 16px;
    display: grid;
    grid-template-columns: repeat(5,82.5vw);
    overflow-x: auto;
  }
  .home .widget_popular_entries .widget-entry-cards .a-wrap:nth-last-child(-n+2) {
    display: block;
  }
  .content-top {
    margin: 0 0;
  }
  .content-bottom {
    background-color: var(--bg2);
  }
  .content-bottom .ad-wrap img {
    width: 100%;
    max-width: 520px;
}

  .home .main .entry-content {
    border-radius: 0px;
    box-shadow: inset 0 2px 0 -1px var(--bg1);
}

  ul.list-apps {
    grid-template-columns: repeat(9, 40.5vw);
    gap: 1em;
    padding: 0 20px;
    overflow-x: auto;
    margin: 0 -20px;
    overflow-x: auto;
  }
  ul.list-apps.s-size {
    grid-template-columns: repeat(7, 24vw);
    gap: 3.0vw;
  }
  ul.list-apps li .sitetitle, .article ul.list-apps li .sitetitle {
    font-size: 10px;
}
  ul.list-apps .btn-area.mt0 {
    padding: 2px 6px 10px 6px;
    font-size: .7em;
    gap: 6px;
  }
  ul.list-apps .circle {
    padding: 0 10px;
}
ul.list-apps > li , .article ul.list-apps > li {
    font-size: .8em;
  }


  .btn-s {
    font-size: 10px;
  }


  main.main, div.sidebar {
    margin: 0 0;
    padding: 0px 0px 0px;
    border-radius: 0px;
  }
  .content, .footer {
    margin-top: 0px;
  }
  .entry-content .toc {
    padding: .5em 1.5em;
    width: 80%;
    /* background-color: var(--bg1); */

    background-color: transparent;

    border-radius: 0px;
    border: 0;
  }



  .toc-title {
    font-size: 0.95em;
  }

  .toc-checkbox:checked~.toc-content {
    max-height: 200px;
    overflow-x: scroll;
  }
  .rate-star {
    font-size: 10px;
  }
  .app-list-table .app-icon {
    max-width: 56px;
  }
  .app-list-table tbody td {
    padding:14px 8px;
    min-width: 95px;
}

.compare-table tbody td {
  padding: 16px 8px;
}

.app-list-table tbody td:first-child {
    font-size:.8em;
    max-width: 80px;
    overflow: hidden;
  }
  .app-list-table tbody td.price {
    min-width: 35vw;
  }
  .info-table thead th {
    font-size: .8em;
    padding: 1em;
  }
  .info-table tbody th, .info-table tbody td {
    padding: 0.75em 0.75em;
    font-size: .8em;
  }

  .rank-app-list .ranking-item-image-tag img {
    max-width: 140px;
  }
  
  .price-box {
    background: var(--bg2);
  }
  .rect-vertical-card-3 .related-list {
    column-gap: 5%;
    margin: 0 0px 1.8em;
  }

  .rect-vertical-card-3 .related-entry-card-wrap {
    width: calc(95% / 2);
    padding: 0;
  }
  .rect-vertical-card .related-entry-card {
    gap: 10px;
  }
  .rect-vertical-card .related-entry-card-content {
    padding: 0px 0 0px;
  }
  .rect-vertical-card .related-entry-card-title {
    font-size: 13px;
    margin-bottom: 0;
  }
  .rect-vertical-card .e-card-snippet {
    display: none;
  }
  .widget h2, .sidebar .widget-title {
      font-size: 1.25em;
  }
  .related-entries .related-entry-heading {
    font-size: 1.5em;
    margin-bottom: .6em;
}

.btn-m, .btn-wrap.btn-wrap-m > a {
  padding: 10px 20px;
  font-size: .85em;
}
.sitecard.bottom-large .site-icon .sitetitle {
  font-size: 1em;
}
.sitecard.bottom-large .sitetitle + span {
  font-size: 85%;
}

.sitecard.bottom-large .site-icon img {
  width: 20vw;
  height: 20vw;
  border-radius: 12px;
}
.sitecard.bottom-large .top-content {
  gap: 0.75em;
}


}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
  .fs-75 {
    font-size: 92%;
  }
  .fs-80 {
    font-size: .8em;
  }
  .pc {
    display: none;
  }  
  .info-list {
    max-height: 180px;
    height: 35vw;
    padding: 0px 20px;
    border-radius: 0;
    margin-bottom: 16px;
  }
  .home .main .textwidget.custom-html-widget {
    margin-bottom: 16px;
}
  .featured-apps-block {
    grid-template-columns: 1fr;
    gap: 1em;
    overflow-x: auto;
    display: grid;
    border-radius: 0;
}
.entry-content .toc {
  width: 95%;
}
.review-section.column-wrap {
  grid-template-columns: 1fr;
}

  .footer .menu {
    grid-template-columns: 1fr 1fr;
  }
  .footer-widgets > div {
    padding: 5% 20px;
  }
  .footer .menu li .site-icon {
    width: 32px;
    height: 32px;
    min-width: 32px;
  }
  .footer .menu li a {
    padding: 0.7em .85em;
  }
  .footer-widgets h3.widget-title {
  }

  .speech-wrap .speech-balloon::before {
  }
  .speech-wrap .speech-balloon {
    font-size: .9em;
  }
  .speech-wrap:not(.not-nested-style).sbp-r .speech-balloon::before {
    
  }
  .sbs-line.sbp-r:not(.not-nested-style) .speech-balloon::after {
    right: -7px;
  }

  .blogcard {
    padding: 7.5% 5.5% 4.0%;}

  .widget-entry-cards .a-wrap .widget-entry-card {
    column-gap: 0px;
  }
  .carousel-entry-card-title, .blogcard-snippet {
    -webkit-line-clamp: 2;
}
  .box-section.paters-bg {
    background-color: rgba(var(--app-bg-paters-rgb), 0.3);
  }
  .box-section.patrona-bg {
    background-color: rgba(var(--app-bg-patrona-rgb), 0.3);
  }
  .box-section.pj88-bg {
    background-color: rgba(var(--app-bg-pj88-rgb), 0.3);
  }
  .box-section.jmail-bg {
    background-color: rgba(var(--app-bg-jmail-rgb), 0.3);
  }
  .box-section.lovean-bg {
    background-color: rgba(var(--app-bg-lovean-rgb), 0.3);
  }
  .box-section.wakuwaku-bg {
    background-color: rgba(var(--app-bg-wakuwaku-rgb), 0.3);
  }
  .box-section.paddy-bg {
    background-color: rgba(var(--app-bg-paddy-rgb), 0.3);
  }
  .box-section.pappy-bg {
    background-color: rgba(var(--app-bg-pappy-rgb), 0.3);
  }
  .box-section.sugardaddy-bg {
    background-color: rgba(var(--app-bg-sugardaddy-rgb), 0.3);
  }

  .box-section.pato-bg {
    background-color: rgba(var(--app-bg-pato-rgb), 0.3);
  }
  .box-section.patolo-bg {
    background-color: rgba(var(--app-bg-patolo-rgb), 0.3);
  }

  .box-section.ikukuru-bg {
    background-color: rgba(var(--app-bg-ikukuru-rgb), 0.3);
  }
  .box-section.type-1 .sitecard {

    box-shadow: 0 2px 5px 1px rgba(0,0,0,.1);
  
  }

  .info-list-item-meta {
    display: flex;
    flex-direction: column;
  }

  .table-card .btn-area {
    flex-direction: column;
  }
  .pickup-table .btn-area .btn {
    padding: 6px 2px;
    font-size: .95em;
  }

  .cat-label {
    font-size: .6em;
    padding: 5px 10px;
  }
  .article .head-d-t1 {
    padding: 1.5rem 6.5rem 1.5rem 0;
  }
  .article .head-d-t2 {
    padding: 1.5rem 0 1.5rem 0;
  }


  .logo-menu-button img {
    max-height: 10.5vw;
  }
  .footer-bottom {
    padding: 0px 0px;
  }
  .footer-bottom-logo .logo-image {
    padding: 0;
  }
  .footer-bottom-logo img {
    height: 8vw;
    max-height: 50px;
  }
  .footer-bottom-logo .site-name-text:before {
    width: 45vw;
    height: 35vw;

    background-position: center;
  
  }

  .categoryid-12 .go-to-top, .categoryid-3 .go-to-top {
    bottom: calc(0em + 100px);
  }
  .categoryid-12 #mobile-toc-widget-wrap, .categoryid-3 #mobile-toc-widget-wrap {
    bottom: calc(3em + 100px);
  }
  
  #ft-fixed-bar-sp {
    background-color: var(--bg2);
    display: flex;
    align-items: center;
    position: fixed;
    bottom: -100%;
    left: 0;
    width: 100%;
    margin-bottom: 0;
    z-index: 2;
    transition: all .3s ease-in-out;
    box-shadow: inset 0 1px 0 0 var(--bg1);
  }
  .scrl #ft-fixed-bar-sp, .scrl #ft-fixed-bar-sp.site-list-block {bottom: 0px;
    animation: slideInUp .3s ease-in-out;
  }
  
  .footer-site-info {display: flex;
    flex-wrap: wrap;
  }
  .footer-site-info .site-content {flex:1;display: flex;}
  .footer-site-info .btn-area {
    width: 38vw;
    padding: 15px 15px;
    max-width: 160px;
    display: table;
  }
  .footer-site-info .btn-area  .btn {
    font-size: 13px;
    display: table-cell;
    vertical-align: middle;
    padding: 10px 4px 10px;
    line-height: 1;
  }
  .footer-site-info .site-content .site-img {width: 80px;
    padding: 10px 10px;}
  
    .footer-site-info .site-content .site-img img {
      width: 16vw;
      height: 16vw;
      border-radius: 12px;
  }
  .footer-site-info .site-content .site-info {flex:1; margin: 0; display: table;}
  .footer-site-info .site-info a {display: table-cell; vertical-align: middle;text-decoration: none;}
  .footer-site-info .site-info a p {display: none;}
  .footer-site-info .site-info h3, .article .entry-content .footer-site-info .site-info h3 {font-size: 18px; line-height: 1.1; color:var(--text-main);    padding: 0px 0px; margin: 0;
  background-color: transparent;font-family: var(--header-font-family);
  }
  .footer-site-info .site-info h3 span {
    display: block;
    color:var(--cocoon-google-plus-color);
    font-weight: bold;
    font-size: 95%;
    margin: 0.2em 0 0;
    letter-spacing: 0.1pt;
    text-transform: capitalize;
  }
  .footer-site-info .site-btn { font-size: 14px;
    display: table-cell; vertical-align: middle;
    padding: 12px 4px 13px;}
  
  
  .compare-table .app-icon {
    width: 44px;
    border-radius: 10px;
  }
  .compare-table thead th {
    padding: 12px 2px 10px;
    font-size: .8em;
    white-space: nowrap;
  }

  .compare-table tbody td {
    padding: 12px 8px;
}
  .compare-table tbody th {
    min-width: 64px;
    padding: 12px 8px;
    font-size: .75em;
    text-wrap: nowrap;
  }

  .toggle-wrap .toggle-content {
    padding:0 1.5em;
  }
  .toggle-checkbox:checked ~ .toggle-content {
    padding:0 1.5em;
  }
  

  

  .article h4, .article h5, .article h6 {
    font-size: 15px;
  }
  .post-date .far:before, .post-update .fas:before {
    width: 13px;
    height: 13px;
  }


  .flex-wrap {
    gap: .8em;
  }
  .flex-wrap img {
  min-width: 17vw;
  max-width: 300px;
  }
  .flex-wrap img.icon-img {
    min-width: 27.5vw;
}


  .price-txt .price-amount {
    font-size: 7vw;
  }

    .breadcrumb {
    font-size: 11px;
  }

  .list {
    margin: 20px 20px;
    row-gap: 16px;
  }
  .ect-vertical-card {
    column-gap: 10px;
  }
  .list .entry-card-wrap, .ect-vertical-card .entry-card-wrap {
    width: calc(50% - 5px);
    background-color: transparent;
  }
  .ect-vertical-card.ect-3-columns {
    column-gap: 1.2em;
  }
  .ect-vertical-card.ect-3-columns .entry-card-wrap {
    width: calc((100% - 1.2em) / 2);
  }

  .e-card-title {
    font-size: .85em;
  }
  .ect-vertical-card .entry-card-wrap:first-child .e-card-title {
    font-size: .9em;
  }
  .entry-card, .related-entry-card, .e-card-title {
    line-height: 1.45;
  }
  .ect-vertical-card .entry-card-wrap .entry-card-content {
    padding: 0em 0em;
  }

  .entry-content {
    margin-top: 1.0em;
    margin-bottom: 0em;
    padding: 0px 20px;
  }
  div.sidebar {
    padding: 20px 20px 20px;
    /* background-color: var(--bg2); */
  }
  .entry-title {
    font-size: 20px;
    padding: 0.6em 0;
  }

  .navi-footer-in a {
    font-size: 11px;
  }



  .post-date, .post-update, .post-author, .amp-back {
    margin-right: 6px;
    font-size: 0.8em;
}
  .main .article-header {
    grid-template-columns: 50vw auto;
}
  .main .entry-title, .main .archive-title {
    padding: 12px 20px;
    font-size: 1.2em;
  }
.single .main .has-post-thumbnail .article-header .entry-title::after {
    top: -0.25em;
    font-size: 9px;
    padding: 1px .75em;
}

  .main .archive-title {
    margin: 2em auto 2em;
  }
  .main .archive-title {
    padding: 2em 0px 1.0em;
    font-size: 1.0em;
  }

  .main .article-header .date-tags {
    padding-left: 20px;
    white-space: nowrap;
}
.read-time {font-size: 0.75em;}
.main .article-header .ss-top {
  padding-right: 20px;
}
.main .article-header .sns-buttons {
  column-gap: 4px;
}
.main .article-header .sns-buttons a {
  width: 32px;
  height: 32px;
  border-radius: 50px;
}

div.speech-balloon .post-author {
  font-size: .85em;
}
div.speech-balloon p {
  font-size: 1.0em;
}


.maste-box {
  padding: 2.0em 1.5em 1.5em;
}
.heading04::before, .heading04::after {
  width: 4px;
  height: 28px;
}
.app-list-table tbody th {
  padding: 10px 12px;
  min-width: 64px;
  font-size: .75em;
}

.compare-table .btn-area {
  padding: .5em .5em;
  gap: .6em;
}

.app-list-table .app-icon {
  max-width: 44px;
}
.app-list-table tbody th .site-icon .app-icon, .compare-table tbody th .app-icon {
  max-width: 54px;
}
.app-list-table .site-icon + .sitetitle, .compare-table .site-icon + .sitetitle {
  font-size: 9px;
}

.footer-bottom.fnm-text-width .menu-footer li a {
  padding: 0 10px;
}
.copyright {
  font-size: 10px;
  margin-top: 3.5em;
}
.navi-footer-in > .menu-footer li.menu-item {
  width: auto;
}

.stripe_bg {
  padding: 1.5em 2em;
}
.stripe_bg:after {
  top: .75em;
  right: .75em;
  bottom: .75em;
  left: .75em;
}
ol.circle li {
  gap: .75em;
}
ol.circle li h4 {
  padding:5px 0;
}
ol.circle.p2, ol.circle.p4 {
  margin: 0 auto 3.5em 0;
  padding: 1.5em;
  padding-left: 1em;
}

.wp-block-table .has-fixed-layout .btn {
  font-size: 12px;
}
  .article h2 {
    margin-top: 2.0em;
    font-size: calc( 1.1em + .25vw);
    position: relative;
    top: inherit;
  }
  .article h3 {
    font-size: calc( 1.0em + .25vw);
  }
  .alert-box h4, .alert-box h3 {
    font-size: calc( 1.0em + .5vw);
  }
  .app-info p.desc {
    margin: .8em auto .8em;
    font-size: .95em;  }
    
  .card-item .title-name h3 {
    font-size: 1.35em;
  }
  .title-block {
    gap: 12px;
}
.more-link {
  font-size: 0.85em;
  padding: 1.0em 3.5em 1.0em 1.5em;
  line-height: 1;
}
.blank-box, .primary-box {
  padding: 20px 30px 30px;
  border-radius: 8px;
  margin-bottom: 1.8em;
}

  .card-item .title-block .site-icon {
    width: 52px;
    min-width: 52px;
    height: 52px;
    border-radius: 8px;
  }

  .box-section {
    margin: 0 -20px;
    padding: 20px 20px;
    background-color: var(--bg1);
    margin-top: 2.5em;
  }

  .box-inner {
    border: 2px solid var(--bg1);
    background-color: var(--bg2);
  }
  .box-inner.negative {
    padding: 13.5% 5% 5%;
    margin-top: -13.5%;
  }
  .column-wrap .box-inner.negative {
    padding: 13.5% 5% 5%;
    margin-top: -13.5%;
  }
  .heading09 {
    background-size: 44px;
    font-size: 1.1em !important;
    padding: 0.8em 0 0.8em 3.2em !important;
    background-position: left 0.9em;
  }


  .Dark .heading05 {
    border-bottom: 4px solid var(--bg1);/*下線の設定*/
  }

  .heading11::before {
    margin-right: 0.5em;
    font-size: 21px;
    min-width: 48px;
    line-height: 48px;
  }
.heading11::after {
  left: 28px;
  bottom: 10px;
}

/* .heading08:before, .heading08:after {
  width: 15%;
} */

.flex-left img.guide-img {
  max-width: 20vw;
  margin: 0 0 0 16px;
}

ul.column-3 {
  gap: 0px;
  grid-template-columns: 1fr;
}

.column-wrap .heading11::before {
  font-size: 1.1em;
  min-width: 44px;
  line-height: 44px;
  margin-left: -.25em;
}
.column-wrap .heading11::after {
  left: 1.1em;
  bottom: 11px;
}

.related-entries {
  padding: 0 20px;
}

.price-box .price-box-ttl {
  padding: 1.25em 1.2em;
}


  .flick-box ul, .flick-box .slide-list {
    margin: 0 -20px;
    padding: 0 20px;
    gap: 20px;
    height: auto;
    -webkit-flex-direction: row;
    flex-direction: row;
    display: flex;
    -webkit-overflow-scrolling: touch;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-snap-align: start left;
    -ms-overflow-style: none;
    scrollbar-width: none;
    scroll-padding: 0 50%;
    scroll-behavior: smooth;
    scrollbar-width: none;
    -ms-overflow-style: none;
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(2,72.5vw);
    overflow-x: auto;
}

.sitecard {
  gap: 10px;
}

.sitecard .top-content {
  margin-top: 1.5em;
}
.sitecard .site-icon a {
  padding: 0 1.5em 0px;
}

.sitecard .site-desc {
  display: -webkit-box;
  overflow: hidden;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  font-size: 85%;
  padding: 0 1.5em;
  line-height: 1.3;
}
.sitecard .site-icon img {
  width: 16vw;
  height: 16vw;
  border-radius: 12px;
}

.widget .sitecard .site-icon {
  max-width: 120px;
}

.sidebar .widget .sitecard .site-icon {
  max-width: 128px;
}
.sidebar .title-block .site-icon {
  width: 22vw;
  min-width: 80px;
  max-width: 100px;
  height: 22vw;
}
.entry-content .sitecard {
  gap: 10px;
}
.entry-content .sitecard .bottom-content .btn-area {
  gap: 12px;
  padding:0px 1.5em 1.5em;
}
.entry-content .sitecard .top-content {
  margin-top: 1.25em;
  gap: 1.5em;
}
/* .entry-content .sitecard .site-icon a {
  padding: 0 0;
}
.entry-content .sitecard .site-desc {
  padding: 0px 0;
} */

.entry-content .sitecard.small .top-content {
  margin-top: 0;
}
.entry-content .sitecard.small .site-icon a {
  padding: 0 0 0;
}


.sitecard .bottom-content .btn-area, .app-info .btn-area {
  gap: 12px;
  padding: 0px 1.5em 1.5em;
}



.app-info .btn-area .btn {
  font-size: .9em;
  padding: 10px 12px;
}


.app-info .btn-area {
  padding: 0px 0px 16px;
}
.sitecard .sitetitle {
  font-size: 18px;
}
.heading11, .heading12 {
  font-size: 1.1em !important;
}
.info-table thead th {
  font-size: .65em;
  padding: .85em .8em;
}
.info-table tbody th, .info-table tbody td {
  padding: .95em .8em;
  font-size: .8em;
}
.info-table tbody th {
  padding: .95em .5em;
  font-size: .7em;
}

  ul.list-grid li {
    width: 31vw;
  }

  ol.step-list li {
    padding-left: 3.25em;
  }
  ol.step-list li h3 {
    padding: 8px 0px;
    margin: 0 auto .6em;
    font-size: 1.1em;
  }
  ol.step-list li::before {
    font-size: 1.2em;
    left: 0;
  }
  ol.step-list li:not(:last-child):after {
    left: 1.1em;
}
.article .featured-apps .site-icon {
  max-width: 128px;
  padding: 20px 20px 4px;
}

ul.split, ol.split  {
  grid-template-columns: 1fr;
}
ul.circle li, ol.circle li {
  margin: 0.6em auto;
  padding-left: 1.5em;
  line-height: 1.25;
}
ol.circle li {
  padding-left: 2.5em;
}
ul.circle li:before {
  top: .3em;
  width: 10px;
  height: 10px;
}

.pickup-table .table-card .sitetitle { 
  font-size: .85em;
}

.sidebar .widget-entry-cards figure {
  width: 38vw;
  max-width: 160px;
}

.sidebar .ranking-item-rating {
  margin-top: -4px;
  padding: 2px 12px;
}
.sidebar .item-ranking-box .title-name h3, .sidebar .item-ranking-box .title-name h4 {
  font-size: 1.0em;
}
.bx-design13 {
  padding: 6vw 5.5vw 5.5vw;
  margin: 2.75rem auto;
}
.bx-design13 .bx-design13-ttl {
  padding: 0 5%;  
  font-size: 1.0em;
}


  .is-style-information-box, .is-style-question-box, .is-style-alert-box, .is-style-memo-box, .is-style-comment-box, .is-style-ok-box, .is-style-ng-box, .is-style-good-box, .is-style-bad-box, .is-style-profile-box, .information-box, .question-box, .alert-box, .information, .question, .alert, .memo-box, .comment-box, .common-icon-box {
    padding: 16px 16px 16px 60px;
    
  }
  .is-style-information-box::before, .is-style-question-box::before, .is-style-alert-box::before, .is-style-memo-box::before, .is-style-comment-box::before, .is-style-ok-box::before, .is-style-ng-box::before, .is-style-good-box::before, .is-style-bad-box::before, .is-style-profile-box::before, .information-box::before, .question-box::before, .alert-box::before, .information::before, .question::before, .alert::before, .memo-box::before, .comment-box::before, .common-icon-box::before {
    top: 1.0em;
    left: 6%;
    margin-left: -0.25em;
    font-size: 32px;
  }
  .information-box::before, .memo-box::before {
    width: 26px;
    height: 26px;
    left: .75em;
    top: 1.0em;
  }

  .author-box {
    margin: 4em auto 1.8em;
    font-size: .8em;
    padding: 2.25em 0em 2.25em;
  }
  .author-box p {
    font-size: .85em;
  }
  .author-box .author-content {
    margin-left: 0;
  }
  .author-box .sns-buttons {
    column-gap: 4px;
  }
  .author-box .author-thumb {
    width: 25%;
    margin-right: 0;
    max-width: 54px;
  }

}