@charset "utf-8";

@import "normalize.css";
@import "color.css";
@import "ads.css";

/* Reset Styles */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  font-size: 100%;
  vertical-align: baseline;
}

/* Base Styles (Mobile-First) */
html {
  font-size: 62.5%; 
  background-color: var(--sub-color);   
  font-family: 'Noto Sans JP', sans-serif;
  height: 100%;
}

body {
  min-height: 100vh;
}

a:link, 
a:visited { 
  color: #333; 
  text-decoration: none; 
  transition: all 0.2s ease-in; 
  -webkit-tap-highlight-color: rgba(0,0,0,0); 
  tap-highlight-color: rgba(0,0,0,0);
}

a:hover {
  text-decoration: none;
}

img {
  max-width: 100%;
  height: auto;
  vertical-align: middle;
  aspect-ratio: attr(width) / attr(height); 
}

.wrapper {
  position: relative;
  display: table;
  width: 100%;
  height: 100vh;
  padding: 0;
  margin: 0;
  background-color: #e9e5de;
  transition: all 0.5s ease 0.2s;
}

.wrapper_inner {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

/* Menu
*******************************************************************************************************************/
.check {
  display: none;
}

.menu_icon {
  position: fixed;
  display: block;
  border-radius: 50%;
  top: 15px;
  right: 15px;
  width: 51px;
  height: 51px;
  z-index: 3;
  background: var(--menu-color);
}

.menu_icon:hover {
  cursor: pointer;
  opacity: 1;
  transition: .5s ease all;
}

.menu_icon::before,
.menu_icon::after {
  content: "";
  position: absolute;
  z-index: -2;
  border-radius: 50%;
  top: 50%;
  left: 50%;
  height: 0;
  width: 0;
  transition: all .5s cubic-bezier(1.000, 0.005, 0.000, 1.000);
}

.menu_icon:hover::before,
.menu_icon:hover::after {
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: rgba(255, 255, 255, 0);
  transition: all .5s cubic-bezier(1.000, 0.005, 0.000, 1.000);
}

.bar1, 
.bar2, 
.bar3 {
  position: absolute;
  top: 16px;
  left: 12px;
  display: block;
  width: 27px;
  height: 1px;
  background: #CCC;
  -webkit-transition: all .5s;
  transition: all .5s;
  -webkit-transform-origin: left top;
  transform-origin: left top;
}

.bar2 {
  top: 25px;
  opacity: 1;
}

.bar3 {
  top: 34px;
  -webkit-transform-origin: left bottom;
  transform-origin: left bottom;
}

.wdc_menu {
  box-sizing: border-box;
  position: fixed;
  top: 0;
  right: 0;
  width: 300px;
  height: 100%;
  overflow-y: scroll;
  overflow-x: hidden;
  background-color: var(--cm-base);
  -webkit-overflow-scrolling: touch;
  overflow-scrolling: touch;
  -webkit-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: .5s;
  transition-duration: .5s;
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
  -webkit-transform: translateX(300px);
  transform: translateX(300px);
}

.wdc_menu::-webkit-scrollbar {
  width: 6px;	
  opacity: 0.5;
}

.wdc_menu::-webkit-scrollbar-thumb {
  width: 6px;
  border-radius: 3px;
  background: var(--cm-sc1); 
}

.wdc_menu::-webkit-scrollbar-thumb:hover {
  background: var(--cm-sc2); 
}

.wdc_menu--t { 
  font-family: 'Roboto Condensed', sans-serif; 
  font-weight: 400;
  color: var(--cm-opa50);
  font-size: 1.6rem; 
  letter-spacing: 0.2rem; 
  padding: 32px 0 29px 25px;
}

.wdc_menu--form { 
  position: relative;
}

.wdc_menu--form input[type="search"],
.wdc_menu--form input[type="submit"] {
  -webkit-appearance: none; 
  border-radius: 0; 
}

.wdc_menu--form input[type=text] {
  font-size: 16px;
}

.wdc_menu--form_input {
  border: none;
  outline: none;
  background: var(--cm-input);
  width: 100%;
  height: 55px;
  z-index: 10;
  padding: 0 15px;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 16px;
  color: #e9e5de;
  transition: all 0.2s ease-in;
}

.wdc_menu--form_input::placeholder {
  color: #FFF; 
  opacity: 0.5; 
  font-size: 1.4rem;
}

.wdc_menu--form_input:focus::placeholder {
  color: #000;
}

.wdc_menu--form_input:focus {
  background: #e9e5de;
  color: var(--cm-dark);
}

.wdc_menu--form_submit {
  color: transparent;
  width: 55px;
  height: 55px;
  display: block;
  position: absolute;
  right: 0;
  top: 0;
  line-height: 50px;
  text-align: center;
  cursor: pointer;
  background: url(../img/search.svg) no-repeat 20px 20px var(--cm-dark);
  border: none;
  outline: none;
  transition: all 0.2s ease-in; 
}

.wdc_menu--form_submit:hover, 
.wdc_menu--form_submit:active { 
  background-color: var(--cm-over);
}

.wdc_menu--content { 
  padding: 40px 0 50px 0;
}

.wdc_menu_info {
  background-color: var(--cm-dark); 
  padding: 0 30px 10px 30px;
}

.wdc_menu_info--entry {
  color: #FFF; 
  padding-top: 30px; 
  margin-bottom: 15px; 
  border-top: dotted 1px var(--cm-opa50); 
  font-size: 1.4rem; 
  opacity: 0.6;
}

.wdc_menu_info--entry span {
  font-family: 'Roboto Condensed', sans-serif;  
  font-weight: 400;  
  font-size: 3.0rem; 
  margin: 0 8px;
}

.wdc_menu_info--cap {
  color: #FFF;
  font-size: 1.15rem; 
  text-align: justify; 
  line-height: 1.8; 
  letter-spacing: 0.12rem; 
  margin-bottom: 30px; 
  opacity: 0.6;
}

.wdc_menu--links { 
  padding: 30px 25px;
}

.wdc_menu--links ul {
  list-style: none; 
  padding: 0px; 
  display: inline-block; 
  line-height: 2.0;
}

.wdc_menu--links li a {
  color: var(--cm-opa50);
  font-family: 'Roboto Condensed', sans-serif; 
  font-weight: 400; 
  font-size: 1.7rem; 
  letter-spacing: 0.08rem;
}

.wdc_menu--links li a:hover,
.wdc_menu--links li a:active {
  color: #FFF;
}

.wdc_menu--conT { 
  color: var(--cm-opa50); 
  margin-bottom: 12px; 
  font-family: 'Roboto Condensed', sans-serif; 
  font-weight: 400; 
  font-size: 1.2rem; 
  letter-spacing: 0.08rem;
}


.wdc_menu--color { 
  display: block;
  margin-bottom: 20px; 
  padding: 0 0 0 27px;
}

.wdc_menu--color ul {
  list-style: none; 
  padding: 0px;
  height: 19px; 
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}

.wdc_menu--color li a { 
  display: block; 
  margin: 0px 10px 10px 0px; 
  height: 19px; 
  width: 19px; 
  border-radius: 50%;
}

li.color_01 a {
  background-image: linear-gradient( -45deg, rgb(255,0,0) 18%, rgb(255,252,0) 30%, rgb(1,180,57) 50%, rgb(1,207,156) 55%, rgb(0,234,255) 63%, rgb(25,158,240) 69%, rgb(49,82,224) 80%, rgb(152,41,211) 85%, rgb(255,0,198) 91%);
  background-image: -webkit-linear-gradient( -45deg, rgb(255,0,0) 18%, rgb(255,252,0) 30%, rgb(1,180,57) 50%, rgb(1,207,156) 55%, rgb(0,234,255) 63%, rgb(25,158,240) 69%, rgb(49,82,224) 80%, rgb(152,41,211) 85%, rgb(255,0,198) 91%);
}

li.color_02 a {background-color: #FFF;}
li.color_03 a {background-color: #dfceb4;}
li.color_04 a {background-color: #999;}
li.color_05 a {background-color: #00a0e9;}
li.color_06 a {background-color: #984697;}
li.color_07 a {background-color: #ec77ab;}
li.color_08 a {background-color: #e60012;}
li.color_09 a {background-color: #f39800;}
li.color_10 a {background-color: #ffff00;}
li.color_11 a {background-color: #23ac38;}
li.color_12 a {background-color: #956134;}
li.color_13 a {background-color: #000;}

.wdc_menu--color.sub_color{ 
  display: none;
}

.wdc_menu--layout { 
  display: none;
}

.link_tab {
  width: 100%;
}

.link_tab-label {
  font-family: 'Roboto Condensed', sans-serif; 
  font-size: 1.4em; 
  font-weight: 400; 
  letter-spacing: 0.1rem;
  color: var(--cm-opa50);
  display: inline-block;
  padding: 12px 0;
  width: 50%;
  margin: 0;
  text-align: center; 
  cursor: pointer;
}

.link_tab-label:hover, 
.link_tab-label:active {
  color: #FFF;
}

input[name="tab-radio"]:checked + .link_tab-label {
  background-color: var(--cm-dark); 
  color: var(--cm-opa50);
}

input[name="tab-radio"], 
.link_tab-content {
  display: none;
}

#tab-1:checked ~ .link_tab-1-content,
#tab-2:checked ~ .link_tab-2-content {
  display: block;
}

.link_tab-content {
  background-color: var(--cm-dark); 
  padding: 30px 0px;
  height: 100%; 
  color: var(--cm-opa50); 
  font-size: 1.3rem; 
  letter-spacing: 0.02rem;
}

.link_tab-title {
  font-family: 'Roboto Condensed', sans-serif;
  font-size: 1.3em; 
  font-weight: 400; 
  letter-spacing: 0.04rem; 
  color: rgba(255,255,255,.8); 
  margin: 15px 25px 15px 25px; 
  padding: 10px 0 10px 0px; 
  position: relative;
}

.link_tab-title::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  height: 1px;
  width: 100%;
  background: var(--sub-color);
}

.link_tab-content ul { 
  list-style: none;
}

.link_tab-content li a {
  position: relative; 
  color: var(--cm-opa50); 
  padding: 5px 0px 5px 25px; 
  display: block; 
  transition: color 0.4s ease;
  font-size: 1.26rem;
}

.link_tab-content li a:hover, 
.link_tab-content:active { 
  color: #FFF;
}

.link_tab-content li a::before {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  width: 0;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.06);
  transition: width 0.4s ease;
}

.link_tab-content li a:hover::before {
  right: auto;
  left: 0;
  width: 100%;
}

.close_menu {
  position: fixed;
  top: 0;
  right: 300px;
  width: 100%;
  height: 100vh;
  background: rgba(0,0,0,0);
  -webkit-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: .3s;
  transition-duration: .3s;
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
  visibility: hidden;
  opacity: 0;
}

.check:checked ~ .wdc_menu {
  -webkit-transition-delay: .2s;
  transition-delay: .2s;
  -webkit-transform: none;
  transform: none;
  opacity: 1;
  z-index: 2;
}

.check:checked ~ .wrapper {
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
  -webkit-transform: translateX(-300px);
  -ms-transform: translateX(-300px);
  transform: translateX(-300px);
}

.check:checked ~ .menu_icon {
  background: rgba(0,0,0,0);
  position: fixed;
}	

.check:checked ~ .menu_icon .bar1 {
  width: 29px;
  left: 16px;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

.check:checked ~ .menu_icon .bar2 {
  opacity: 0;
}

.check:checked ~ .menu_icon .bar3 {
  width: 29px;
  top: 36px;
  left: 16px;
  -webkit-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.check:checked ~ .close_menu {
  -webkit-transition-duration: 1s;
  transition-duration: 1s;
  -webkit-transition-delay: .3s;
  transition-delay: .3s;
  background: rgba(0,0,0,.5);
  visibility: visible;
  opacity: 1;
  z-index: 3;
}

/* Menu
*******************************************************************************************************************/
.header_bg { 
  background-color: var(--main-color);
  position: relative; 
  height: 80px;
  transition: 0.4s ease-in-out;
}
.header_logo {
  width: 140px;
  height: 17px;
}

.header_logo img,
img[src="/img/logo.svg"] {
  width: 140px !important;
  height: 17px !important;
  aspect-ratio: 140/17;
}

.header_logo a {
  position: absolute; 
  left: 16px; 
  bottom: 19px;  
  display: block; 
  color: #FFF; 
  width: 140px; 
  height: 17px;
  opacity: 0.75; 
  transition: opacity 0.2s ease;
  contain: layout style paint;
}

.header_logo a:hover, 
.header_logo:active {
  opacity: 1; 
}

.header_h1 { 
  display: none;
}

.nav_item {
  background-color: #f3f0e9; 
  height: 55px; 
  min-height: 55px; 
  contain: layout style;
}

.nav_item ul {
  margin: 0; 
  padding: 0; 
  white-space: nowrap; 
  text-align: center; 
  height: 55px; 
  line-height: 55px;
}

.nav_item li {
  display: inline-block; 
  vertical-align: top;
}

.nav_item li a {
  font-family: 'Roboto Condensed', 'Arial Narrow', sans-serif; 
  font-display: swap; 
  font-size: 1.33rem; 
  font-weight: 400; 
  letter-spacing: 0.04rem; 
  position: relative;
  color: #333; 
  padding: 0 14px; 
  height: 55px; 
  display: block; 
  letter-spacing: 0.04rem;
  transition: background-color 0.2s ease;
}

.nav_item li a:hover, 
.nav_item li a:active { 
  background-color: #fff;
}

.navi_jp {
  width: 63px;
}

.navi_wd {
  width: 61px;
}

.navi_lp {
  width: 105px;
}

.navi_sp {
  width: 96px;
}

/* Index
*******************************************************************************************************************/
.contents {
  padding: 55px 10px 30px 10px;
}

.contents_top {
  padding: 50px 10px 10px 10px;
}

.contents_btm {
  padding: 60px 10px 0px 10px;
}

.contents_ad {
  padding: 50px 10px 20px 10px; 
  background-color: #e2dcd3;
  position: relative;
  overflow: hidden;
}

.contents_ad--cap {
  position: absolute;
  left: 50%; 
  bottom: 15px;
  transform: translateX(-50%); 
  font-family: 'Roboto Condensed', sans-serif;  
  font-weight: 400; 
  font-size: 1.0rem; 
  color: #6b6765; 
  letter-spacing: 0.2rem;
}

.contents_link {
  display: none;
}

/* Post
*******************************************************************************************************************/
.post, 
.post_li,
.post_center, 
.post_bottom {
  max-width: 336px;
  margin: 0 auto; 
  /* transition: 0.2s ease-in-out; */
}

.post_ul,
.post_bottom-ul {
  list-style: none; 
  display: flex; 
  flex-wrap: wrap; 
  justify-content: center;
  contain: layout;
  content-visibility: auto; 
}

.post_ad--center img {
  aspect-ratio: 336 / 280;
  height: auto;
  display: block;
  max-width: 100%;
}

.post_li {
  margin: 0 0 50px 0; 
  background-color: transparent;
  border: none; 
  position: relative;
  box-shadow: none;
}

.jp { 
  min-height: auto; 
  max-width: 338px;
  width: auto;
} 

.lp { 
  min-height: auto; 
  max-width: 338px;
  width: auto;
} 

.post_empty { 
  width: 338px; 
  height: 0; 
  margin: 0; 
  padding: 0; 
} 

.post_img {
  position: relative; 
  overflow: hidden; 
}

.jp_img {
  height: auto; 
  max-width: 338px; 
  width: auto;
  display: block;
}

.lp_img {
  height: auto; 
  max-width: 338px; 
  width: auto;
  display: block;
}

.post_inner {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  width: 100%;
  height: 100%;
  background: transparent;
  -webkit-transition: .3s;
  transition: .3s; 
  opacity: 1;
  cursor: pointer;
}

.post_li:hover .post_inner {
  opacity: 1;
}

.post_img img {
  -webkit-transition: all 0.3s; 
  transition: all 0.3s; 
  display: block; 
}

.post_li:hover .jp_img img {
  -webkit-transform: scale(1.05);
  transform: scale(1.05);
  filter: grayscale(70%);
}

.post_li:hover .lp_img img {
  -webkit-transform: scale(1.03);
  transform: scale(1.03);
  filter: grayscale(70%);
}

.post_inner--date { 
  display: none;
}

.post_inner--tec {
  display: none;
}

.post_inner--detail a {
  background: url("../img/detail.svg") no-repeat; 
  width: 50px; 
  height: 50px; 
  background-position: 10px 10px; 
  display: block;
  right: 0px; 
  bottom: 0px; 
  z-index: 1; 
  opacity: 0.8;
  position: absolute;
}

.post_inner--launch a, 
.post_ls_inner--launch a {
  background: transparent;
  width: 100%; 
  height: 100%; 
  display: block; 
  position: absolute;
  transition: none !important;

}

.post_inner--detail a:hover, 
.post_inner--launch a:hover, 
.post_ls_inner--launch a:hover, 
.post_inner--category a:hover {
  opacity: 1.0;
}

.post_inner--qr {
  position: absolute; 
  bottom: 20px; 
  left: 20px;
}

.post_li:hover .post_inner--qr img {
  -webkit-transform: scale(1);
  transform: scale(1);
}

.post_inner--category {
  display: none;
}

.post_inner--description {
  display: none;
}

.post_title h2 { 
  margin: 0;
  padding: 10px 3px 3px 3px; 
  font-size: 1.2rem; 
  line-height: 1.4;
  letter-spacing: 0.04rem; 
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.post_title a {
  color: #666;
}

.post_title a:hover {
  color: #aaa;
}

.post_url { 
  display: none;
}

.post_cate--title { 
  text-align: center; 
  color: #444; 
  font-size: 2.0rem; 
  letter-spacing: 0.1rem;
  padding-bottom: 30px;  
  margin-bottom: 40px; 
  position: relative; 
  white-space: nowrap;
}

.post_cate--subtitle {
  font-size: 1.35rem; 
  padding-top: 5px;
}

.post_cate--title::after {
  content: ''; 
  height: 1px; 
  width: 30px; 
  display: block; 
  background-color: #555; 
  position: absolute; 
  left: 50%; 
  bottom: 15px;
  transform: translateX(-50%);
}

.post_cate { 
  background-color: #f8f6f1; 
  padding: 12px 0px 12px 15px;
}

.post_cate--h2 { 
  font-size: 1.1rem; 
  color: #666; 
  font-weight: normal; 
  letter-spacing: 0.07rem; 
}

.post_cate--h2 span { 
  margin-left: 3px;
}

.breadcrumb {
  letter-spacing: 0.1rem;
}

.breadcrumb ul { 
  list-style: none;
  overflow: hidden; 
  text-overflow: ellipsis; 
  white-space: nowrap; 
  width: 200px;
}

.breadcrumb li { 
  display: inline-block; 
  color: #666;  
  margin-right: 5px; 
  font-size: 1.1rem;
}

.breadcrumb li:last-child::after {
  display: none;
}

.breadcrumb li::after { 
  content: "＞"; 
  margin-left: 6px; 
  font-size: 0.8rem; 
  vertical-align: 1px;
}

.breadcrumb li a { 
  position: relative; 
  color: #666; 
  padding-bottom: 5px;
}

.breadcrumb a:hover {
  color: #888;
}

/* Single Page
*******************************************************************************************************************/
.single {
  margin: 0; 
  max-width: 1000px; 
  padding: 50px 20px 10px 20px; 
  color: #333; 
  display: flex; 
  flex-wrap: wrap; 
  justify-content: center; 
}

.single_left { 
  width: 100%; 
  position: relative; 
  margin-bottom: 30px;
}

.single_left--sp ul {
  list-style: none;
  display: flex;
  flex-wrap: nowrap; 
  justify-content: space-between;
}

.single_left--sp span { 
  display: none;
}

.single_left--sp li {
  width: 100%; 
  margin-bottom: 2px;
}

.single_left--sp li:last-child {
  display: none;
}

.single_left--img img {
  border: 1px solid #dbd4c8; 
}

.single_left--img a { 
  background-color: #FFF;
}

.single_left--img a:hover, 
.single_left--sp li a:hover {
  opacity: 0.8;
}

.single_left--detail { 
  padding: 20px 0px 0px 0px; 
  letter-spacing: 0.12rem; 
  margin-bottom: 5px;
}

.single_left--title {
  padding: 5px 5px 15px 5px; 
  font-size: 1.9rem;
}

.single_left--title a:hover {
  color: #999; 
}

.single_left--url {
  display: none;
}

.single_left--des {
  padding: 0 5px 25px 5px;  
  font-size: 1.25rem; 
  line-height: 1.8;
}

.single_left--qr {
  padding: 0 5px 25px 5px;
}

.single_left--ad { 
  padding: 20px 0; 
  overflow: hidden;
}

.s_count { 
  font-size: 1.4rem; 
  margin-left: 6px;
}

.single_left--sns { 
  margin-bottom: 20px;
}

.single_left--sns ul { 
  list-style: none;
}

.single_left--sns li {
  display: inline-block; 
  margin: 0 4px;
}

.single_left--sns li a {
  background: url(../img/s_sns.png) no-repeat; 
  background-color: #f3f0e9; 
  display: block;
  width: 35px;
  height: 35px; 
  border-radius: 50%;
}

.single_left--sns li a:hover { 
  background-color: #FFF;
}

li.single_left--sns_fb a {
  width: 45px; 
  height: 45px; 
  background-position: 0 top;
}

li.single_left--sns_tw a {
  width: 45px; 
  height: 45px; 
  background-position: -45px top; 
}

li.single_left--sns_ht a {
  width: 45px; 
  height: 45px; 
  background-position: -90px top;
}

li.single_left--sns_pr a {
  width: 45px; 
  height: 45px; 
  background-position: -135px top;
}

.single_left--category {
  font-family: 'Roboto Condensed','Noto Sans JP', sans-serif;
  white-space: nowrap;
}

.single_left--tag { 
  margin-bottom: 10px;
}

.single_left--tag ul, 
.single_left--category ul { 
  list-style: none; 
  display: flex; 
  flex-wrap: wrap;
}

.single_left--tag li a, 
.single_left--category li a { 
  font-size: 1.15rem; 
  background-color: #f3f0e9; 
  padding: 8px 10px; 
  display: inline-block; 
  margin: 3px;
  border-radius: 4px;
}

.single_left--tag li a:hover, 
.single_left--category li a:hover {
  background-color: #FFF;
}

.single_right {
  width: 100%;
}

.single_right--title {
  font-family: 'Roboto Condensed','Noto Sans JP', sans-serif; 
  text-align: center; 
  font-size: 1.6rem; 
  letter-spacing: 0.1rem; 
  padding-bottom: 40px; 
  margin-bottom: 20px; 
  position: relative;
}

.single_right--title::after {
  content: ''; 
  height: 2px; 
  width: 15px; 
  display: block; 
  background-color: #999; 
  position: absolute; 
  left: 50%; 
  bottom: 15px;
  transform: translateX(-50%);
}

.single_right--entry_a { 
  margin-bottom: 20px;
}

.single_right--entry_a a { 
  color: #666;
}

.single_right--entry_a a img {
  transition: all 0.2s ease-in; 
  background-color: #FFF;
}

.single_right--entry_a a:hover img {  
  opacity: 0.7;
}

.single_right--entry_a a:hover .single_right--entry_right {
  background-color: #FFF;
}

.single_right--entry_post {
  display: flex;
}

.single_right--entry_left { 
  width: 120px; 
  height: 79px; 
  overflow: hidden; 
  background-color: #FFF; 
  position: relative;
}

.single_right--entry_right { 
  flex: 1; 
  position: relative; 
  background-color: #f3f0e9;
  transition: all 0.2s ease-in;
}

.single_right--entry_title { 
  font-size: 1.1rem; 
  position: absolute; 
  left: 14px; 
  top: 17px; 
  letter-spacing: 0.05rem; 
  text-overflow: ellipsis; 
  width: 185px;
  overflow: hidden; 
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.single_right--entry_url {
  font-family: 'Roboto Condensed', sans-serif; 
  font-weight: 400; 
  letter-spacing: 0.04rem; 
  font-size: 1.05rem; 
  position: absolute; 
  left: 16px; 
  bottom: 15px; 
  color: #666; 
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap; 
  width: 180px;
}

.single_pagebtn { 
  display: none;
}

/* Group Link */
.single_group {
  margin: 0 auto; 
  width: 1000px; 
  padding: 0px 0 50px 0; 
  color: #333; 
  display: flex; 
  flex-wrap: nowrap; 
  justify-content: space-between; 
}

.single_group--sub { 
  width: 320px;
}

.single_group--title {
  font-family: 'Roboto Condensed', sans-serif; 
  font-weight: 400; 
  font-size: 1.5rem; 
  text-align: center; 
  letter-spacing: 0.03rem; 
  padding-bottom: 28px; 
  margin-bottom: 8px; 
  position: relative;
}

.single_group--title::after {
  content: ''; 
  height: 1px; 
  width: 15px; 
  display: block; 
  background-color: #777; 
  position: absolute; 
  left: 50%; 
  bottom: 15px;
  transform: translateX(-50%);
}

.single_group--entry_a { 
  margin-bottom: 21px;
}

.single_group--entry_a a { 
  color: #666;
}

.single_group--entry_a a img {
  transition: all 0.2s ease-in; 
  background-color: #FFF;
  vertical-align: bottom;
}

.single_group--entry_a a:hover img {  
  opacity: 0.7;
}

.single_group--entry_a a:hover .single_group--entry_right {
  background-color: #FFF;
}

.single_group--entry_post {
  display: flex;
}

.single_group--entry_left { 
  width: 120px; 
  height: 79px; 
  overflow: hidden; 
  background-color: #FFF; 
  position: relative;
}

.single_group--entry_right { 
  flex: 1; 
  position: relative; 
  background-color: #f3f0e9;
  transition: all 0.2s ease-in;
}

.single_group--entry_title { 
  font-size: 1.1rem; 
  position: absolute; 
  left: 14px; 
  top: 15px; 
  letter-spacing: 0.05rem; 
  text-overflow: ellipsis; 
  width: 200px;
  overflow: hidden; 
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.single_group--entry_url {
  font-family: 'Roboto Condensed', sans-serif; 
  font-weight: 400; 
  letter-spacing: 0.05rem; 
  font-size: 10px; 
  position: absolute; 
  left: 16px; 
  bottom: 15px; 
  color: #666; 
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap; 
  width: 200px;
}

/* Page
*******************************************************************************************************************/
.con_page {
  max-width: 700px; 
  margin: 0 auto; 
  padding: 45px 15px 40px 15px;
  color: #333;
  font-size: 1.0rem; 
}

.con_page--title { 
  text-align: center; 
  color: #444; 
  font-size: 2.0rem; 
  letter-spacing: 0.1rem; 
  padding-bottom: 30px; 
  margin-bottom: 40px; 
  position: relative; 
  white-space: nowrap;
}

.con_page--title::after {
  content: ''; 
  height: 1px; 
  width: 30px; 
  display: block; 
  background-color: #333; 
  position: absolute; 
  left: 50%; 
  bottom: 15px;
  transform: translateX(-50%);
}

.con_page--search { 
  width: 100%; 
  padding: 60px 0 80px 0; 
  color: #333; 
  display: block; 
}

.con_page--search01 {
  text-align: center;  
  font-size: 1.2rem; 
  margin-bottom: 30px;
  letter-spacing: 0.1rem;
}

.con_page--search02 {
  text-align: center;  
  font-size: 1.1rem;
  letter-spacing: 0.08rem;
  margin-bottom: 50px;
  max-width: 300px; 
  margin: 0 auto;
}

.con_page--searchform {
  margin: 0 auto;  
  width: 360px;
  margin-bottom: 40px;
}

.wdc_left--input {
  margin: 0 8px 0 0; 
  padding: 0px 20px; 
  max-width: 100%;
  height: 33px; 
  width: 260px; 
  outline: none; 
  border: 1px solid #aaa;
  background: #f3f0e9;
  color: #777;
  font-size: 16px; 
  border-radius: 20px;
  transition: all 0.2s ease-in;
}

.wdc_left--input:focus {
  background: #FFF;
  color: #333;
}

.wdc_left--btn {
  height: 35px; 
  width: 35px; 
  border: none; 
  border-radius: 20px !important;
  margin: 0; 
  padding: 0; 
  vertical-align: top; 
  background: url(../img/s_btn.png) no-repeat var(--color-03);
  transition: all 0.2s ease-in;
}

.wdc_left--btn:hover {
  opacity: 0.8; 
  outline: 0;
}

.con_page--title02 {  
  font-size: 1.6rem; 
  margin-bottom: 10px auto;
  letter-spacing: 0.1rem; 
  text-align: center;
}

.con_page--title02 span {
  position: relative;
  display: inline-block;
  padding: 0 1.8rem;
}

.con_page--title02 span::before, 
.con_page--title02 span::after {
  position: absolute;
  top: 50%;
  content: '';
  width: 1.2em;
  height: 1px;
  background-color: #999;
}

.con_page--title02 span::before {
  left: 100%;
}

.con_page--title02 span::after { 
  right: 100%;
}

.con_page--sub {
  font-size: 1.5rem; 
  margin-bottom: 15px;
  letter-spacing: 0.1rem; 
  position: relative;
}

.con_page--sub::after {
  content: ''; 
  height: 1px; 
  width: 8px; 
  display: block; 
  background-color: #444; 
  position: absolute; 
  left: -12px; 
  top: 10px;
}

.con_page--text {
  font-size: 1.35rem; 
  margin-bottom: 18px;
  letter-spacing: 0.25rem; 
  text-align: justify; 
  line-height: 2.0;
}

.con_page--wdc {
  margin: 0px 0 5px 10px; 
  font-size: 1.3rem;
}

.con_page--noteL {
  font-size: 1.8rem; 
  text-align: center;
}

.con_page--note { 
  line-height: 1.8; 
  letter-spacing: 0.1rem; 
  padding: 50px; 
  background-color: #f3f0e9; 
  border-radius: 8px; 
  margin-bottom: 100px; 
}

.con_page--link { 
  margin-bottom: 15px; 
}

.con_page--link a {
  font-size: 1.35rem;
  background-color: #f3f0e9; 
  letter-spacing: 0.15rem; 
  line-height: 1.8; 
  position: relative; 
  margin-left: 10px; 
  padding: 5px 10px;
}

.con_page--link a:hover {
  color: #666; 
  background-color: #FFF; 
  margin-left: 15px;
}

.con_page--link a::before {
  position: absolute;
  content: '';
  width: 6px;
  height: 6px;
  border-top: solid 1px #444;
  border-right: solid 1px #444;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  top: 12px;
  left: -14px;
}

/* Page Navi
*******************************************************************************************************************/
.wp-pagenavi { 
  display: none;
}

.page_btn { 
  background-color: #f3f0e9; 
  font-family: 'Roboto Condensed', sans-serif;   
  font-weight: 400; 
  font-size: 1.4rem; 
  letter-spacing: 0.1rem;
  justify-content: flex-end; 
  display: flex;
}

.page_btn--l {
  flex-basis: 50%; 
  order: 1;
}

.page_btn--r {
  flex-basis: 50%; 
  order: 2;
}

.page_btn--l a {
  height: 60px; 
  line-height: 60px; 
  display: block; 
  padding-left: 48px;
}

.page_btn--r a {
  height: 60px; 
  line-height: 60px; 
  display: block; 
  padding-right: 48px;
}

.page_btn--l a {
  background: url("../img/page_l.svg") no-repeat #f3f0e9; 
  background-position: left 25px center; 
  text-align: left;
}

.page_btn--r a {
  background: url("../img/page_r.svg") no-repeat #f3f0e9; 
  background-position: right 25px center; 
  text-align: right;
}

.page_btn--l a:hover, 
.page_btn--r a:hover,
.page_btn--l a:active, 
.page_btn--r a:active { 
  background-color: #FFF;
}

.page_btn::after {
  display: block;
  content: "";
  clear: both;
  overflow: hidden;
}

/* Form
*******************************************************************************************************************/
.form_page { 
  max-width: 500px; 
  margin: 0px auto 60px auto; 
  padding-top: 30px;
}

.form_page--name {
  padding: 35px 0 3px 0; 
  font-size: 1.4rem;
  letter-spacing: 0.2rem; 
  position: relative;
}

.form_page--submit {
  padding: 30px 0 30px 0; 
  text-align: center; 
  margin-bottom: 20px; 
  font-size: 1.3rem;
}

.form_page--hissu { 
  position: absolute; 
  right: 0; 
  font-size: 1.1rem; 
  letter-spacing: 0.4rem; 
  padding: 1px 20px; 
  background: #555;
  color: #fff;
  border-radius: 3px;
}

.form_page input[type=text], 
.form_page input[type=email] {
  width: 100%;  
  padding: 10px; 
  margin-bottom: 5px; 
  font-family: "Noto Sans JP", sans-serif;
  font-size: 16px; 
  letter-spacing: 0.15rem; 
  border-bottom: solid 1px #AAA;
  border-top: none; 
  border-right: none; 
  border-left: none; 
  background-color: #e9e5de;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 0;
  transition: all 0.2s ease-in;
}

.form_page textarea {
  resize: none; 
  width: 100%; 
  border-bottom: solid 1px #AAA; 
  padding: 15px;
  border-bottom: solid 1px #AAA;
  border-top: none; 
  border-right: none; 
  border-left: none; 
  background-color: #e9e5de; 
  margin-bottom: 2px;
  transition: 0.2s ease-in-out;
  font-size: 16px; 
  letter-spacing: 0.15rem;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 0;
  transition: all 0.2s ease-in;
}

span.wpcf7-list-item { 
  display: block; 
}

.form_page input:focus, 
.form_page textarea:focus {
  border-bottom: solid 1px #AAA;
  border-top: none; 
  border-right: none; 
  border-left: none; 
  background-color: #f3f0e9;
  color: #333;
}

.form_page input, 
.form_page textarea {
  outline: none;
}

.form_page input[type=submit] {
  transition: 0.2s ease-in-out;
  text-align: center;
  display: inline-block;
  border: none;
  width: 250px;
  height: 40px;
  color: #FFF;
  background-color: var(--main-color);
  border-radius: 20px;
}

.form_page input:hover[type=submit] {
  border: none;
  cursor: pointer;
  background-color: var(--color-03);
}

.wpcf7-not-valid-tip { 
  font-size: 1.1rem !important; 
  color: red !important;
}

.wpcf7 form .wpcf7-response-output {
  margin: 2em 0.5em 1em !important; 
  font-size: 1.25rem;
  padding: 15px !important; 
  background-color: #f3f0e9 !important; 
  text-align: center !important; 
  margin-bottom: 10px !important; 
  border-radius: 30px !important; 
  border: none !important;
}

.wpcf7 form.init .wpcf7-response-output {
  display: none;
}

.wpcf7 form.sent .wpcf7-response-output {
  padding: 15px !important; 
  background-color: #f3f0e9 !important; 
  text-align: center !important; 
  margin-bottom: 10px !important; 
  border-radius: 30px !important; 
  border: none !important;
}

.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output {
  padding: 15px !important; 
  background-color: #f3f0e9 !important; 
  text-align: center !important; 
  margin-bottom: 10px !important; 
  border-radius: 30px !important; 
  border: none !important;
}

.wpcf7 form.spam .wpcf7-response-output {
  padding: 15px !important; 
  background-color: #f3f0e9 !important; 
  text-align: center !important; 
  margin-bottom: 10px !important; 
  border-radius: 30px !important; 
  border: none !important;
}

.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output {
  padding: 15px !important; 
  background-color: #f3f0e9 !important; 
  text-align: center !important; 
  margin-bottom: 10px !important; 
  border-radius: 30px !important; 
  border: none !important;
}

.ajax-loader, 
.wpcf7-spinner {
  display: none !important;
}

/* reCAPTCHA */
.grecaptcha-badge {
  margin-bottom: 48px;
}

.recap {
  background: #666; 
  color: #BBB; 
  border-radius: 10px; 
  margin-bottom: 30px; 
  padding: 20px; 
  letter-spacing: 0.05em;
  font-family: 'Roboto Condensed', sans-serif; 
  font-weight: 400; 
  font-size: 1.3rem; 
}

.recap a {
  color: #FFF;
}



/* PageTop */
.pagetop {
  position: fixed;
  width: 60px;
  height: 60px; 
  right: 0px; 
  display: none;
}

.top_arrow {
  position: absolute;  
  top: 10px; 
  right: 10px;
}

.top_arrow a {
  background: url(../img/pagetop.png) top left no-repeat;
  background-color: var(--main-color);
  display: block;
  width: 38px;
  height: 38px;
  -webkit-border-radius: 50%;
  border-radius: 50%;
}

.top_arrow a:hover {
  text-decoration: none;
  background: url(../img/pagetop.png) top left no-repeat var(--color-03);
}

/* Footer
*******************************************************************************************************************/
footer {
  margin-top: auto;
}

.btm { 
  background-color: var(--main-color);
  position: relative; 
  transition: 0.4s ease-in-out;
}

.btm_sns { 
  text-align: center; 
  padding: 50px 0 8px 0; 
  margin-bottom: 15px;
}

.btm_sns ul { 
  list-style: none;
}

.btm_sns li {
  display: inline-block; 
  margin: 0 7px;
}

.btm_sns li a { 
  background-color: #555; 
  display: block; 
  border-radius: 50%; 
}

.btm_sns li a:hover, 
.btm_sns li a:active { 
  opacity: 1.0;
}

li.btm_fb a {
  background: url("/img/sns_f.svg") no-repeat var(--color-03); 
  width: 35px; 
  height: 35px; 
  background-position: 13px 10px; 
  opacity: 0.4;
}

li.btm_tw a {
  background: url("/img/sns_t.svg") no-repeat var(--color-03);  
  width: 35px; 
  height: 35px; 
  background-position: 11px 11px; 
  opacity: 0.4;
}

li.btm_ht a {
  background: url("/img/sns_h.svg") no-repeat var(--color-03);  
  width: 35px; 
  height: 35px; 
  background-position: 12px 12px; 
  opacity: 0.4;
}

li.btm_fd a {
  background: url("/img/sns_b.svg") no-repeat var(--color-03);  
  width: 35px; 
  height: 35px; 
  background-position: 9px 11px; 
  opacity: 0.4;
}

.btm_link { 
  margin-bottom: 45px;
  letter-spacing: 0.08em; 
  text-align: center; 
}

.btm_link ul { 
  list-style: none;
}

.btm_link li {
  display: inline-block; 
}

.btm_link li a {
  color: #BBB; 
  padding: 0 4px 5px 4px; 
  position: relative; 
  font-size: 1.15rem;
}

.btm_link ul li:last-child {
  display: none;
}

.btm_link li a::after, 
.btm_breadcrumb li a::after {
  position: absolute;
  bottom: -3px;
  left: 50%;
  content: '';
  width: 0;
  height: 1px;
  background-color: var(--color-02);
  transition: .3s;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}

.btm_link li a:hover::after {
  width: 80%;
}

.btm_link li a:hover { 
  color: #FFF; 
}

.btm_copy { 
  font-size: 1.1rem; 
  font-family: 'Roboto Condensed', sans-serif; 
  font-weight: 400;  
  text-align: center; 
  letter-spacing: 0.12em; 
  padding: 15px 0 25px 0; 
  color: #BBB; 
}

.btm_hl { 
  display: block;
  font-size: 1.05rem;
  text-align: center; 
  letter-spacing: 0.2rem; 
  padding: 0 0 0 0; 
  color: #BBB;
}


/* Ads
*******************************************************************************************************************/
.post_ad {
  display: flex;
  justify-content: center;
  align-items: center; 
  position: relative; 
  padding: 0; 
  max-width: 336px; 
  width: auto;
  margin: 0 0 70px 0; 
  background-color: #f3f0e9; 
  min-height: 280px;
  box-shadow: none; 
  border: none;
}

.post_ad--cap {
  position: absolute; 
  left: 50%; 
  bottom: -23px;
  transform: translateX(-50%); 
  font-family: 'Roboto Condensed', sans-serif;  
  font-weight: 400; 
  font-size: 1.0rem; 
  color: #625e5c; 
  letter-spacing: 0.2rem; 
}

.post_ad--top, 
.post_ad_bottom--top {
  display: flex;
  justify-content: center;
  align-items: center; 
  position: relative; 
  max-width: 350px; 
  width: 300px; 
  padding: 0; 
  margin: 0 0 80px 0; 
  background-color: #f3f0e9;
  border: none; 
  min-height: 540px;
}

.post_ad--center {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  max-width: 300px;
  width: 300px; 
  padding: 0; 
  margin: 0 0 47px 0; 
  background-color: #f3f0e9; 
  min-height: 250px;
}

.post_ad--btm, 
.post_ad_bottom--btm {
  display: none;
}

.post_ad--sky {
  display: flex;
  justify-content: center;
  align-items: center; 
  position: relative; 
  max-width: 300px; 
  width: 300px; 
  margin: 0 0 80px 0; 
  padding: 0; 
  background-color: #f3f0e9;
  border: none; 
  min-height: 540px;
}

.post_ad_bottom { 
  text-align: center; 
  margin: 0 auto 30px auto; 
  overflow: hidden;
}

.single_right--ad {  
  height: 280px; 
  width: 336px;
  display: flex;
  justify-content: center;
  align-items: center; 
  margin: 0 auto 50px auto;  
  min-height: 280px;
}

.single_ad_bottom { 
  text-align: center; 
  box-sizing: border-box; 
  margin: 0 auto 60px auto; 
}

/* Ad Sizes (Mobile-First) */
.ad_338_280 { 
  width: 336px; 
  height: 280px; 
  min-width: 336px; 
  min-height: 280px;
}

.ad_ls_338_280 { 
  width: 300px; 
  height: 540px; 
  min-width: 300px; 
  min-height: 540px; 
}

.ad_338_616 { 
  width: 300px; 
  height: 540px; 
  min-width: 300px; 
  min-height: 540px; 
}

.ad_728_90 { 
  width: 300px; 
  height: 250px; 
  min-width: 300px; 
  min-height: 250px;
}

.ad_970_250 { 
  width: 300px; 
  height: 250px; 
  min-width: 300px; 
  min-height: 250px; 
}

.adobe_ad { 
  display: none;
}

/* Amazon */
.s_amazon {
  position: relative; 
  display: flex; 
  flex-wrap: wrap; 
  align-items: flex-start; 
  padding: 0px 25px 15px 25px; 
  height: 275px;
}

.s_amazon .amazon_link {
  position: absolute; 
  top: 0; 
  left: 0; 
  display: block; 
  height: 100%; 
  width: 100%;
}

.s_amazon_img { 
  width: 100%; 
  padding-top: 20px; 
  text-align: center;
}

.s_amazon_img img {
  max-height: 128px;
}

.s_amazon_text {
  width: 310px; 
  font-size: 1.5rem; 
  font-weight: bold; 
  letter-spacing: 0.02rem; 
  line-height: 2rem; 
  display: flex; 
  flex-direction: column;
  margin-top: auto; 
}

.s_amazon_text p {
  padding-bottom: 3px; 
  font-weight: normal; 
  font-size: 1.2rem; 
  color: #2c2fe6;
}

.s_amazon_btn {
  text-align: center;
  margin-top: 10px;
}

.s_amazon_btn .amazon {
  width: 100%;
}

.s_amazon_btn .amazon a {
  background-color: #ffd700; 
  color: #000;
}

.s_amazon_btn .amazon a::before {	
  background: #fff100;
}

.s_amazon_btn .amazon a {
  font-size: 1.35rem; 
  position: relative;
  display: block;
  padding: 8px 0;
  box-shadow: 0px 8px 8px -8px #999;
  z-index: 1;
  border-radius: 3px;
  transition: .3s;
}

.s_amazon_btn .amazon a::before {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
  content: '';
  border-radius: 3px;
  transform-origin: left bottom;
  transform: scale(1, 0);
  transition: transform .3s;
}

.s_amazon_btn .amazon a:hover::before {
  transform-origin: left top;
  transform: scale(1, 1);
}

.post_ad--center.ad_01,
.post_ad--center.ad_03 {
  display: none;
}

/* Utility Classes */
.sp_hide { 
  display: none;
}



/* Media Queries - Mobile First Approach */

/* Small Tablets and Large Phones (480px and up) */
@media screen and (min-width: 30em) {
  .breadcrumb ul { 
    width: 330px;
  }
  
  .con_page {
    padding: 45px 25px 40px 25px;
  }
}

/* Tablets (600px and up) */  
@media screen and (min-width: 37.5em) {
  
  .post_ad {
    max-width: 300px; 
    min-height: 250px;
  }
  .post_ad--top, 
  .post_ad_bottom--top,
  .post_ad--sky {
    margin: 0 0 47px 0; 
  }

  .post_li {
    background: transparent;
    box-shadow: none;
  }

  .jp { 
    min-height: auto; 
    max-width: 338px;
  }

  .lp { 
    min-height: auto; 
    max-width: 338px; 
  }

  .jp_img {
    height: auto; 
    max-width: 338px; 
    width: auto;
  }

  .lp_img {
    height: auto; 
    max-width: 338px; 
    width: auto; 
  }

  .post_title h2 { 
    padding: 10px 3px 3px 3px; 
    font-size: 1.2rem;
  }

  .breadcrumb ul { 
    width: 330px;
  }

  .single {
    margin: 0; 
    padding: 50px 20px 20px 20px;
  }

  .single_left--sp li:last-child {
    display: none;
  }

  .single_left--sp li {
    width: 100%;
  }

  .btm_link ul li:last-child {
    display: none;
  }

}

/* Small Desktop/Large Tablet (660px and up) */
@media screen and (min-width: 41.25em) {
  .ad_728_90 { 
    width: 468px; 
    height: 60px; 
    min-width: 468px; 
    min-height: 60px; 
  }
  
  .btm_link ul li:last-child {
    display: inline-block;
  }
  .post, 
  .post_center, 
  .post_bottom {
      max-width: 770px;
  }

  .post_ul,
  .post_bottom-ul{
    display: flex; 
    flex-wrap:wrap; 
    justify-content: space-around;
  }
	.post_li{
    margin: 0 0 50px 0;  
    border: none; 
    background:transparent; 
    box-shadow:none; 
    background-color:#FFF;
    border: 1px solid #dbd4c8; 
    position: relative;
  }
	.jp{ 
    min-height: 250px; 
    max-width: 300px; 
  }
	.lp{ 
    min-height: 540px; 
    max-width: 300px; 
  }
	.post_inner{
    background:transparent; 
    opacity: 1; 
    cursor: pointer;
  }

	.jp_img{
    height: 197px; 
    max-width: 300px; 
    width: 300px; 
    aspect-ratio: 300 / 197;
  }
	.lp_img{
    height: 485px; 
    max-width: 300px; 
    width: 300px; 
    aspect-ratio: 300 / 485;
  }
  .post_title h2{ 
    padding: 11px 13px 3px 13px; 
    font-size: 1.2rem;
  }
  
  .single_left--sp li {
    width: 49%;
  }

  .single_left--sp li:last-child {
    display: block;
  }
  .ad_338_280 { 
  width: 300px; 
  height: 250px; 
  min-width: 300px; 
  min-height: 250px;
}

}

/* Medium Desktop (860px and up) */
@media screen and (min-width: 53.75em) {
  /* Menu adjustments for desktop */
  .wdc_menu {
    width: 430px;
    -webkit-transform: translateX(430px);
    transform: translateX(430px);
  }

  .close_menu {
    right: 430px;
  }

  .check:checked ~ .wrapper {
    -webkit-transform: translateX(-430px);
    -ms-transform: translateX(-430px);
    transform: translateX(-430px);
  }

  .menu_icon {
    position: absolute;
    background: rgba(0,0,0,0);
  }

  .menu_icon:hover::before,
  .menu_icon:hover::after {
    background-color: rgba(255, 255, 255, 0.05);
  }

  .wdc_menu--content { 
    padding: 50px 0 35px 0;
  }

  .wdc_menu--color.sub_color{ 
    display: block;
}

  .wdc_menu--layout { 
    display: block;
    margin-bottom: 50px; 
    padding: 0 0 0 27px;
  }

  .wdc_menu--layout ul {
    list-style: none; 
    padding: 0px;
    height: 19px; 
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
  }

  .wdc_menu--layout li {
    width: 50px; 
    margin-right: 13px;
  }

  .wdc_menu--layout li a {
    background: url(../img/layout.png) no-repeat; 
    display: block; 
    margin-right: 9px; 
    height: 35px; 
    width: 50px; 
    font-family: 'Roboto Condensed', sans-serif;  
    font-weight: 400;
    font-size: 1.1rem;  
    position: relative; 
    color: #CCC; 
    opacity: 0.7;
  }

  .wdc_menu--layout li a p {
    width: 50px; 
    margin-right: 13px; 
    text-align: center; 
    position: absolute; 
    bottom: -20px;
  }

  .wdc_menu--layout li a:hover {
    opacity: 1.0;
    background-color: var(--cm-input);
  }

  li.layout_01 a {background-position: 0 top;}
  li.layout_02 a {background-position: -50px top;}
  li.layout_03 a {background-position: -100px top;}
  li.layout_04 a {background-position: -150px top;}
  li.layout_05 a {background-position: -200px top;}
  li.layout_06 a {background-position: -250px top;}

  .wdc_menu--layout dd { 
    letter-spacing: 0.1em;
    text-align: center;
    padding: 0px; 
    position: absolute; 
    bottom: -19px; 
    width: 50px;
  }

  .link_tab-content li a {
    padding: 9px 0px 9px 30px; 
    font-size: 1.3rem;
  }

  .wdc_menu_info--entry {
    font-size: 1.6rem;
  }

  /* Header adjustments */
  .header_bg {
    height: 135px;
  }

  .header_h1 { 
    display: block;
    font-size: 1.05rem; 
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif"; 
    color: #FFF; 
    letter-spacing: 0.15rem; 
    opacity: 0.6; 
    padding: 18px 16px; 
    -webkit-font-smoothing: subpixel-antialiased;
  }

  .nav_item {
    height: 54px; 
    min-height: 54px;
  }

  .nav_item ul {
    height: 54px; 
    line-height: 54px;
  }

  .nav_item li a {
    padding: 0 16px; 
    height: 54px;
  }

  .navi_jp {
    width: 67px;
  }

  .navi_wd {
    width: 65px;
  }

  .navi_lp {
    width: 109px;
  }

  .navi_sp {
    width: 100px;
  }

  /* Content adjustments */
  .contents {
    padding: 60px 0px 0px 0px;
  }

  .contents_top {
    padding: 50px 0px 10px 0px;
  }

  .contents_btm {
    padding: 60px 0px 0px 0px;
  }

  .contents_ad {
    padding: 50px 0px 20px 0px;
  }

  .contents_link {
    display: block;
    padding: 20px 60px 20px 60px; 
    min-height: 380px;
  }

  .index_link {
    width: 350px; 
    margin: 0 0 30px 0;
  }

  /* Posts adjustments */
  .post_ul,
  .post_bottom-ul {
    justify-content: space-between;
    contain-intrinsic-size: 360px;
  }
  .post_bottom-ul{
    min-height: 327px;
  }

  .post_li {
    margin: 0 0 60px 0; 
    background-color: #FFF;
    border: 1px solid #dbd4c8; 
    box-shadow: none;
  }

  .jp { 
    min-height: 294px; 
    max-width: 350px;
  } 

  .lp { 
    min-height: 630px; 
    max-width: 350px;
  } 

  .jp_img {
    height: 229px; 
    max-width: 350px; 
    width: 350px; 
    aspect-ratio: 350 / 229;
  }

  .lp_img {
    height: 565px; 
    max-width: 350px; 
    width: 350px; 
    aspect-ratio: 350 / 565;
  }

  .post_inner {
    background: rgba(0,0,0,.6);
    opacity: 0;
    cursor: auto;
  }

  .post_li:hover .post_inner {
    opacity: 1;
  }

  .post_inner--date { 
    display: block;
    position: absolute; 
    top: 15px; 
    left: 15px; 
    color: #FFF; 
    font-family: 'Roboto Condensed', sans-serif; 
    font-weight: 400; 
    font-size: 1.4rem;
  }

  .post_inner--tec {
    display: block;
    position: absolute; 
    bottom: 59px; 
    right: 8px;
    z-index: 3;
  }

  .post_inner--tec a {
    width: 90px; 
    display: block; 
    position: relative; 
    text-align: center; 
    color: #FFF;
    font-family: 'Roboto Condensed', sans-serif; 
    font-weight: 400; 
    font-size: 1.08rem; 
    letter-spacing: 0.07rem; 
    border: solid 1px rgba(255, 255, 255, 0.4); 
    padding: 5px 0; 
    white-space: nowrap; 
    transition: color 0.3s ease;
  }

  .post_inner--tec a::before {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    width: 0;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.25);
    transition: width 0.3s ease;
  }

  .post_inner--tec a:hover::before {
    right: auto;
    left: 0;
    width: 100%;
  }

  .post_inner--detail a {
    width: 38px;
    height: 38px; 
    background: url(../img/post.png) no-repeat 0 top; 
    opacity: 0.6; 
    position: absolute; 
    bottom: 10px; 
    right: 12px;  
    z-index: 3;
  }

  .post_inner--launch a {
    width: 100%; 
    height: 100%; 
    display: block; 
    background: url(../img/launch.png) no-repeat bottom 10px right 58px; 
    opacity: 0.6; 
    position: absolute;
  }

  .post_ls_inner--launch a {
    width: 100%; 
    height: 100%; 
    display: block; 
    background: url(../img/launch.png) no-repeat bottom 10px right 58px; 
    opacity: 0.6; 
    position: absolute;
  }

  .post_inner--category {
    display: block;
    position: absolute; 
    left: 15px; 
    bottom: 14px; 
    z-index: 4;
  }

  .post_inner--category a {
    position: relative; 
    display: block;
    text-decoration: none; 
    font-size: 1.25rem; 
    color: #FFF; 
    opacity: 0.85;
  }

  .post_inner--category::before {
    content: 'CATEGORY'; 
    position: absolute; 
    left: 1px; 
    top: -14px;
    font-size: 1.05rem;
    font-family: 'Roboto Condensed', sans-serif; 
    font-weight: 400; 
    letter-spacing: 0.12rem;
    color: #FFF; 
    opacity: 0.85;
  }

  .post_inner--category a::after {
    position: absolute;
    bottom: -2px;
    left: 0;
    content: '';
    width: 100%;
    height: 1px;
    background: #FFF;
    transform: scale(0, 1);
    transform-origin: right top;
    transition: transform .3s;
    opacity: 0.5;
  }

  .post_inner--category a:hover::after {
    transform-origin: left top;
    transform: scale(1, 1);
  }

  .post_inner--description {
    display: block;
    position: absolute; 
    left: 15px; 
    bottom: 65px; 
    width: 320px;
    border-bottom: solid 1px #AAA; 
    color: #FFF;
    padding-bottom: 12px; 
    opacity: 0.85;
  }

  .post_inner--description p { 
    position: relative; 
    height: 55px;  
    font-size: 1.2rem; 
    letter-spacing: 0.1rem; 
    display: -webkit-box; 
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3; 
    overflow: hidden;
  }

  .post_inner--description::before {
    content: 'DESCRIPTION'; 
    position: absolute; 
    left: 1px; 
    top: -15px;
    font-size: 1.05rem;
    font-family: 'Roboto Condensed', sans-serif; 
    font-weight: 400; 
    letter-spacing: 0.12rem;
    color: #FFF;
  }

  .post_title h2 { 
    padding: 13px 15px 3px 15px; 
    font-size: 1.3rem;
  }

  .post_url { 
    display: block;
    margin: 0; 
    padding: 0px 16px; 
    font-size: 0.95rem; 
    letter-spacing: 0.02rem;
    line-height: 18px;
    color: #777; 
    width: 230px;
    height: auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .post_cate--title { 
    font-size: 2.6rem; 
    padding-bottom: 60px; 
    margin-bottom: 50px;
  }

  .post_cate--title::after {
    height: 2px; 
    width: 40px;
  }

  .breadcrumb ul { 
    width: 600px;
  }

  .breadcrumb li { 
    font-size: 1.2rem;
  }

  /* PageNavi */
  .wp-pagenavi { 
    display: block;
    max-width: 620px; 
    height: 45px; 
    min-height: 45px; 
    margin: 0 auto 70px auto; 
    text-align: center; 
    white-space: nowrap; 
    contain: layout style;
  }

  .wp-pagenavi a, 
  .wp-pagenavi span { 
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: 400;
    font-size: 1.2rem;
    font-display: swap;
    display: inline-block;
    color: #666;
    background-color: #f3f0e9;
    text-decoration: none;
    text-align: center;
    line-height: 44px;
    width: 44px;
    height: 44px;
    margin: 0 6px;
    transition: 0.2s ease-in-out;
    white-space: nowrap;
    -webkit-border-radius: 50%;
    border-radius: 50%;
  }

  .wp-pagenavi a:hover { 
    background-color: #fff; 
    color: #000; 
  }

  .wp-pagenavi span.current {
    background-color: var(--main-color); 
    color: #FFF;
  }

  .pnm { 
    margin-bottom: 30px;
  }

  .page_btn { 
    display: none;
  }

  /* Single page adjustments */
  .single {
    margin: 0 auto 30px auto; 
    max-width: 1000px; 
    padding: 100px 30px 50px 30px; 
    display: flex; 
    flex-wrap: nowrap; 
    justify-content: space-between;
  }

  .single_left { 
    width: calc(100% - 380px);
  }

  .single_left--title {
    font-size: 2.5rem;
    padding: 5px 5px 5px 5px;
  }

  .single_left--url {
    display: block;
    font-size: 1.25rem; 
    padding: 0 5px 25px 5px;
    font-family: 'Roboto Condensed', sans-serif;
    word-break: break-all;
  }

  .single_left--tag li a, 
  .single_left--category li a { 
    font-size: 1.15rem;
  }

  .single_right {
    width: 336px;
  }

  .single_pagebtn { 
    display: block;
    position: relative; 
    font-size: 1.2rem; 
    letter-spacing: 0.1rem; 
    height: 55px;
  }

  .single_pagebtn--next {
    position: absolute; 
    left: -5px; 
    bottom: -28px;
  } 

  .single_pagebtn--back {
    position: absolute; 
    right: -5px; 
    bottom: -28px;
  }

  .single_pagebtn--back a {
    position: relative; 
    background: url("../img/sp_next.png") top left no-repeat; 
    background-color: #f3f0e9; 
    display: block; 
    width: 50px; 
    height: 50px;
    border-radius: 50%; 
    margin: 6px;
  }

  .single_pagebtn--back a::after {
    content: '次のデザイン';
    position: absolute;
    white-space: nowrap; 
    left: 50%; 
    bottom: -26px;
    transform: translateX(-50%); 
    color: #555;
  }

  .single_pagebtn--next a {
    position: relative; 
    background: url("../img/sp_back.png") top left no-repeat; 
    background-color: #f3f0e9; 
    display: block; 
    width: 50px; 
    height: 50px;
    border-radius: 50%; 
    margin: 6px;
  }

  .single_pagebtn--next a::after {
    content: '前のデザイン';
    position: absolute;
    white-space: nowrap; 
    left: 50%; 
    bottom: -26px;
    transform: translateX(-50%); 
    color: #555;
  }

  .single_pagebtn--back a:hover, 
  .single_pagebtn--next a:hover { 
    background-color: #FFF;
  }

  /* Page adjustments */
  .con_page {
    max-width: 700px; 
    padding: 120px 50px 80px 50px;
    font-size: 1.35rem;
  }

  .con_page--title { 
    font-size: 2.6rem; 
    padding-bottom: 60px; 
    margin-bottom: 50px;
  }

  .con_page--title::after {
    height: 2px; 
    width: 40px;
  }

  .con_page--search01 {
    font-size: 1.8rem;
  }

  .con_page--search02 {
    font-size: 1.2rem;
    max-width: none;
    margin: 0 auto 50px auto;
  }

  .con_page--title02 {  
    font-size: 2.0rem;
  }

  .con_page--sub {
    font-size: 2rem;
  }

  .con_page--sub::after {
    width: 12px;
    left: -22px; 
    top: 15px;
  }



  /* Ad adjustments */
  .ad_338_280 {
    width: 338px; 
    height: 280px;  
    min-width: 338px; 
    min-height: 280px;
  }

  .ad_ls_338_280 {
    width: 338px; 
    height: 280px; 
    min-width: 338px; 
    min-height: 280px;
  }

  .ad_338_616 {
    width: 338px; 
    height: 618px; 
    min-width: 338px; 
    min-height: 618px;
  }

  .ad_728_90 {
    width: 728px; 
    height: 90px; 
    min-width: 728px; 
    min-height: 90px;
  }

  .ad_970_250 {
    width: 728px; 
    height: 90px; 
    min-width: 728px; 
    min-height: 90px;
  }

  .adobe_ad { 
    display: block;
    text-align: center; 
    margin: 0 auto 40px auto; 
    width: 728px; 
    height: 90px; 
    min-width: 728px; 
    min-height: 90px;
  }

  .post_ad {
    max-width: 350px; 
    width: 100%;
    margin: 0 0 60px 0; 
    background-color: #FFF; 
    min-height: 270px;
    padding: 1px 0 0 0;
  }

  .post_ad--top, 
  .post_ad_bottom--top {
    max-width: 350px; 
    width: 350px; 
    padding: 6px 0; 
    margin: 0 0 47px 0; 
    background-color: #FFF;
    border: 1px solid #dbd4c8; 
    min-height: 270px;
  }

  .post_ad--center {
    max-width: 336px; 
    width: 336px; 
    padding: 0; 
    margin: 0 8px 47px 8px; 
    min-height: 280px;
  }

  .post_ad--btm, 
  .post_ad_bottom--btm {
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 350px; 
    width: 350px; 
    padding: 6px 0; 
    background-color: #FFF;
    border: 1px solid #dbd4c8; 
    min-height: 270px;
  }

  .post_ad--sky {
    max-width: 350px; 
    width: 350px; 
    padding: 6px 0; 
    background-color: #FFF;
    border: 1px solid #dbd4c8; 
    min-height: 618px;
  }

  /* Footer adjustments */
  .btm_link li a {
    padding: 0 12px 5px 12px; 
    font-size: 1.2rem;
  }

  .btm_link ul li:last-child {
    display: inline-block;
  }
  
 .sp_hide { 
    display: block;
  }
}

/* Large Desktop (1028px and up) */
@media screen and (min-width: 64.25em) {
  .post, 
  .post_center,
  .post_bottom {
    max-width: 770px;
  }
  .post_inner--launch a,
  .post_ls_inner--launch a {
    transition: all 0.2s ease-in !important;
  }

  .ad_728_90 { 
    width: 728px; 
    height: 90px;
  }

  .ad_970_250 { 
    width: 970px; 
    height: 250px; 
    min-width: 970px; 
    min-height: 250px;
  }
}

/* Extra Large Desktop (1220px and up) */
@media screen and (min-width: 76.25em) {
  .post, 
  .post_center,
  .post_bottom {
    max-width: 1180px;
  }
  .post{
    min-height: 600px;
  }

  .post_center li:nth-child(odd) { 
    display: none;
  }

  .contents_link li:nth-child(4) { 
    display: block;
  }

  #Tab1 li, 
  #Tab2 li {  
    margin: 0 5px 0 0; 
    width: 49%;
  }

  .post::after {
    content: "";
    display: block;
    width: 30%;
  }
  
  .post_ad--center.ad_03 {
  display: block;
}
  .btm { 
    min-height: 240px;
}

}

/* Ultra Wide Desktop (1600px and up) */
@media screen and (min-width: 100em) {
  .post, 
  .post_center,
  .post_bottom {
    max-width: 1580px;
  }

  .post_center li:nth-child(-n+1) { 
    display: none;
  }

  .contents_link li:nth-child(4) { 
    display: none;
  }

  #Tab1 li, 
  #Tab2 li { 
    width: 32.5%;
  }

  .clips_data {
    max-width: 1100px; 
    margin: 0 auto; 
  }
  
  .post_ad--center.ad_01 {
  display: block;
}
}




