﻿.VHZEG{
  box-shadow: none;
  position:static;
}

/* ======================================
一覧
====================================== */

.l-list{
  padding:0 0 24px;
  max-width: 768px;
  margin:0 auto;
}

.l-list__title{
  font-weight: bold;
  font-size: 18px;
  margin: 0 16px 24px;
}


.c-tab{
  display: flex;
  margin-bottom: 24px;
}
.c-tab__list{
  flex: 1;
}

.c-tab__link{
  display: block;
  padding:12px 0 13px;
  text-align: center;
  background: #fff;
  color:#7D7F88;
  border-bottom: 1px solid var(--border-gray, #E3E3E7);
}
.c-tab__link:hover,
.c-tab__link.is-active{
  color:#1A1E25;
  padding:12px 0 12px;
  border-bottom: 2px solid #1A1E25;
}



.c-newsList{
  margin: 0 16px;

}
.c-newsList li{
  border-radius: 6px;
  overflow: hidden;
  box-shadow: 0px 24px 96px 0px rgba(67, 67, 67, 0.15);
  margin-bottom: 16px;
  background: #fff;
  position: relative;
  padding-bottom: 32px;

}
@media (min-width: 500px) {
  .c-newsList{
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
  }
  .c-newsList li{
    flex: 0 0 calc(50% - 8px);
    margin-bottom: 0;
  }
}


.c-newsList li a{
  display: block;
  background: #fff;
  border-radius: 6px;
}

.c-newsList__img{
  width: 100%;
}
.c-newsList__img img{
  width: 100%;
  height:auto;
}

.c-newsList__inner{
  padding:16px;
}
.c-newsList__title{
  font-weight: bold;
  font-size: 16px;
  color: #191311;
  margin-bottom: 8px;
}

.c-newsList__text{
  font-size: 14px;
  color:#7D7F88;
}

.c-newsList__categories{
  display: flex;
  gap:8px;
  position: absolute;
  left:16px;
  bottom:10px;
  flex-wrap: wrap;
  padding-right: 100px;
}


.c-newsList__category{
  font-size: 13px;
  color:#7D7F88;
  padding: 4px 16px;
  border-radius: 16px;
  border: 1px solid #eaeaea;
  display: inline-block;
}



.c-newsList__date{
  color: var(--text-sub, #7D7F88);
  font-size: 12px;
  position: absolute;
  right:16px;
  bottom:16px;
}






/* ======================================
詳細
====================================== */
.l-post{
  padding:0 0 0;
  max-width: 768px;
  margin:0 auto;
  background:#fff;
}

.l-post .c-headline1{
  font-size: 20px;
  font-weight: 700;
  line-height: 160%; /* 28.8px */
  padding:32px 16px 0;
}

.c-headBlock{
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 8px 16px 0;
}
.l-post .c-date{
  color: #7D7F88;
  font-family: Hind;
  font-size: 14px;
  letter-spacing: 1.4px;
}

.l-post .c-categories{
  display: flex;
  gap:8px;
}
.l-post .c-category{
  background-color: #fff;
  padding: 4px 16px;
  border-radius: 16px;
  border: 1px solid #eaeaea;
  font-size: 14px;
  display: inline-block;
}
.l-post a.c-category{
  color:#191311;
}
.l-post a.c-category:hover{
  background-color: #eaeaea;
}


.l-post .c-mainImg img{
  height:auto;
  width: 100%;
}





.l-conents{
  padding:24px 16px 40px;
  background: #fff;
}

.l-conents h2{
  font-size: 18px;
  font-weight: 600;
  line-height: 180%; /* 32.4px */
  border-bottom: 3px solid #E3E3E7;
  padding-bottom: 8px;
  margin:40px 0 24px;
  color:#EC681A;
	position:relative;
}
.l-conents h2:after{
	content:"";
	position:absolute;
	bottom:-3px;
	left:0;
	width:60px;
	height:3px;
	background-color:#EC681A;
}

.l-conents h3{
  font-size: 16px;
  line-height: 180%;
  font-weight: bold;
  margin:24px 0 16px;
	padding:10px 24px;
	background-color:#F4F4F4;
	position:relative;
}
.l-conents h3:before{
	content:"";
	position:absolute;
	width:21px;
	height:21px;
	background-color:#ffffff;
	top:0;
	right:0;
	z-index:1;
}
.l-conents h3:after{
	content:"";
	position:absolute;
	top:0;
	right:0;
	z-index:2;
	width: 0;
	height: 0;
	border-style: solid;
	border-color: transparent transparent transparent #EC681A;
	border-width: 21px 0px 0px 21px;
	
}




.l-conents  :first-child {
  margin-top: 0;
}
.l-conents hr{
  border:none;
  border-bottom: 1px solid #eaeaea;
}

.l-conents p{
  margin:24px 0;
  line-height: 2rem;
}

.l-conents p img{
  margin:0 auto;
  display: block;
}

.l-conents ul{
  margin:24px 0;
}

.l-conents ul li{
  position: relative;
  margin-bottom: 4px;
  padding-left: 15px;
}
.l-conents ul li:before{
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 8px;
  height: 8px;
  background-color: #FC7900;
  border-radius: 50%;
}




.l-conents ol{
  margin:24px 0;
  counter-reset: number;
}
.l-conents ol li{
  margin-bottom: 4px;
}

.l-conents ol li:before {
  content: counter(list-item) ".";
  color: #7D7F88;
  margin-right: 10px;
}


.l-conents strong{
  font-weight: bold;
	text-decoration: underline;
	text-decoration-thickness: 0.5em;
	text-decoration-color: #FFF4A7;
	text-underline-offset: -0.2em;
	text-decoration-skip-ink: none;
}

}


.l-conents a{
  color:#664DFB;
}


.l-conents blockquote{
  border-radius: 6px;
  background: #F4F4F4;
  padding:40px 40px;
  position: relative;
  line-height: 1.6;
}
.l-conents blockquote p{
  margin: 0;
}

.l-conents blockquote:before,
.l-conents blockquote:after {
  content: '“';
  font-size: 60px;
  color: #8D8F97;
  position: absolute;
  font-family: "Gravitas One";
  height: 25px;
  line-height: 1;
}

.l-conents blockquote:before {
  left: 10px;
  top: 10px;
}

.l-conents blockquote:after {
  content: '”';
  right: 10px;
  bottom: 6px;
}
/* 20251220 add */
.l-conents iframe[src*="youtube.com"],
.l-conents iframe[src*="youtu.be"] {
  width: 100%;
　max-width:100%;
  height: auto;
  aspect-ratio: 16 / 9;
}

.c-cta{
  border-radius: 6px;
  background: #D3F2D0;
  text-align: center;
  padding:24px 12px;
  margin: 40px 0;
}

.c-cta.is-other{
  background: #eee;
}

.c-cta__text{
  font-weight: bold;
  margin-bottom: 16px;
}

.c-cta .c-cta__button{
  max-width: 440px;
  margin:0 auto 0;
  padding: 0 16px;
  text-align: center;

}

.c-cta__button a{
  display: block;
  padding: 16px 16px;
  border-radius: 6px;
  cursor: pointer;
  text-decoration: none;
  line-height: 1;
  font-weight: 700;
  font-size: 16px;
  color:#fff;
}
.c-cta__button.is-line a{
  background-color: #19b10c;
  display: flex;
  align-items: center;
  justify-content: center;
}

.c-cta__button.is-other a{
  background: var(--primary, linear-gradient(136deg, #FC7900 2.61%, #EC1A1A 96.58%));
}


.c-cta__button .c-cta__button-icon{
  display: inline-block;
  margin:0 16px 0 0;
}



.l-share{
  margin:40px auto;
  padding:0 16px;
  max-width: 440px;
}

.l-share a{
  display: flex;
  width: 100%;
  padding: 12px 0px;
  align-items: center;
  justify-content: center;
  gap: 20px;
  border-radius: 6px;
  border: 1px solid var(--border-gray, #E3E3E7);
  background: var(--Natural-white, #FFF);
  box-shadow: 0px 24px 96px 0px rgba(67, 67, 67, 0.15);
  color: #191311;
  font-weight: bold;
}



.l-relatedList{
  margin: 0 16px;

}
.l-relatedList__title{
  font-weight: bold;
  margin: 40px 16px 8px;
}

.l-relatedList li{
  border-bottom: #E3E3E7 1px solid;
}

.l-relatedList li a{
  padding:16px 0;
  display: block;
  display: flex;
  align-items: center;
  gap: 16px;
}
.l-relatedList__inner{
  width: 100%;
}


.l-relatedList li h3{
  color: #191311;
  font-size: 14px;
  font-weight: 600;
  line-height: 160%; /* 22.4px */
}
.l-relatedList__date{
  color: var(--text-sub, #7D7F88);
  text-align: right;
  font-size: 12px;
}
.l-relatedList li img{
  border-radius: 6px;
  max-width: 160px;
  height:auto;
}





.c-back{
  margin:0 auto;
  padding:40px 16px;
  max-width: 440px;
}

.c-back a{
  text-align: center;
  display: block;
  color: var(--text-primary, #191311);
  line-height: 100%; /* 15px */
  letter-spacing: 0.3px;
  padding: 16px 24px;
  border-radius: 9px;
  border: 1px solid var(--text-gray_pale, #D1D1D1);
}







.c-taxonomies{
  display: flex;
  overflow-x: scroll;
  padding: 0 16px 4px 16px;
  margin-bottom: 12px;
}
.c-taxonomies li{
  display: inline-block;
  flex-shrink: 0;
}
.c-taxonomies .c-taxonomy{
  background-color: #fff;
  padding: 4px 16px;
  border-radius: 16px;
  margin-right: 4px;
  border: 1px solid #eaeaea;
  font-size: 14px;
  color:#191311;
  display: block;
}
.c-taxonomies .c-taxonomy.is-active{
  background-color: #eaeaea;
}
.c-taxonomies a.c-taxonomy:hover{
  background-color: #eaeaea;
}






.pagination {
  display: flex;
  justify-content: center;
  gap:5px;
  margin-top: 20px;
}


.nav-links{
  display:flex;
  gap:5px;
}
.page-numbers{
  display:inline-block;
  color:#666666;
  background:#ffffff;
  border: 1px solid #eaeaea;
  aspect-ratio: 1/1;
  width: 32px;
  height: 32px;
  line-height: 30px;
  text-align: center;
  border-radius: 32px;
  box-sizing: border-box;
}
.page-numbers.current{
  background:#FC7900;
  color:#ffffff;
}
.page-numbers.prev,
.page-numbers.next{
  display: none;
}


#toc_container ul li:before{
	content:none !important;
}


/* 20240913 add */
.modal__banner {
  display: flex;
  justify-content: center;
  align-items: center;
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 10;
  width: 100vw;
  height: 100vh;
  /* opacity: 1;
  visibility: hidden; */
  background-color: rgba(0, 0, 0, 0.7);
  transition: opacity 0.3s, visibility 0.3s;
  cursor: default;
  display: none;

}

.utils-aspect-fix-image{
  position: relative;
}
.modal__link{
  width: min(85%, 700px);

}

.modal__close{
  outline: none;
  border: none;
  position: absolute;
  top: 10px;
  right: 10px;
  width: 29px;
  height: 29px;
  transform: rotate(45deg);
  transition: opacity 0.3s;
  background-color: transparent;
  cursor: pointer;
}
@media screen and (min-width: 960px){
  .modal__close{
    top: 40px;
    right: 60px;
    width: 60px;
    height: 60px;
  
  }

}
.modal__close:before, .modal__close:after{
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: #fff;
}
.modal__close:before{
  width: 100%;
  height: 1px;
}
.modal__close:after{
  width: 1px;
  height: 100%;
}


/* 20240927 add */
#toc_container{
	padding:20px !important;
}
#toc_container li a{
	color:#191311 !important;
	line-height:2.2em !important;
}
#toc_container li .toc_number{
	font-weight:700 !important;
	display: inline-block !important;
	margin-right:4px !important;
}

/* 20241013 add */
.blogcard{
	border:solid 1px #EC681A;
	border-radius: 6px;
}
.blogcard__link{
	display:flex;
	gap:12px;
	align-items:center;
	width:100%;
	box-sizing:border-box;
	position:relative;
	padding:16px 12px 12px;
}
.blogcard__thumbnail{
	font-size:0;
	line-height:0;
}
.blogcard__thumbnail img{
	border-radius:6px;
}
.blogcard__title{
	color:#EC681A;
	font-weight:700;
	font-size:12px;
	background-color:#fff;
	display:inline-block;
	position:absolute;
    top: -0.5em;
    left: 12px;
    line-height: 0;
    z-index: 1;
    padding: 0.5em .5em;
}
.blogcard__detail{
}
.blogcard__detail p{
	color:#000000;
	padding:0;
	margin:0;
	font-size:14px;
	line-height:1.8;
}

/* 20241225 add */
.bg-attention{
	background-color:rgba(236,104,26,0.1);
	padding:16px;
	border-radius:8px;
	margin-bottom:1em;
}
.bg-attention p{
	margin:0;
}
.bg-attention p + p{
	margin-top:1em;
}



.supervisor-block{
	background-color:#ffffff;
	border-radius:6px;
	box-shadow:0 24px 96px rgba(67, 67, 67, 0.15);
	padding:20px 16px;
	margin-bottom:24px;
}
.supervisor-description{
	margin-top:24px;
	background-color:rgba(244, 244, 244, 1);
	border-radius:6px;
	padding:12px;
}
.supervisor-heading{
	display:flex;
	gap:24px;
	align-items:center;
	justify-content:space-between;
}
.supervisor-thumbnail{
	width:116px;
	img{
		width:116px;
		height:116px;
		border-radius:116px;
		object-fit:cover;
		aspect-ratio:1/1;
	}
}
.supervisor-profile{
	flex:1;
	text-align:center;
}
.supervisor-profile_title{
	font-size:12px;
	border:solid 1px #000000;
	border-radius:36px;
	line-height:36px;
	max-width:144px;
	margin:0 auto 18px;
	position:relative;
}

.supervisor-profile_title::before{
	content:"";
	position:absolute;
	width:10px;
	height:12px;
	background-color:#ffffff;
	bottom:-6px;
	left:calc(50% - 5px);
	z-index:1;
}
.supervisor-profile_title::after{
	content:"";
	position:absolute;
	width:1px;
	height:12px;
	background-color:#000000;
	bottom:-6px;
	left:calc(50% - 0px);
	z-index:2;
	transform:skew(-20deg);
}
.supervisor-profile_potision{
	color:rgba(125, 127, 136, 1);
	font-size:14px;
	font-weight:400;
}
.supervisor-profile_name{
	font-size:18px;
	font-weight:700;
}
.supervisor-profile_x{
	width:26px;
	margin:4px auto 0;
}

/* 20250112 add */
.l-post--cta{
	position: fixed;
	z-index:11;
    bottom: 0;
    left: 0;
    width: 100%;
	padding:10px;
	box-sizing:border-box;
	background-color:#fff;
}
.l-post--cta .c-cta__button{
	max-width:400px;
	margin:auto;
}

/* 20250113 add */
.l-ranking{
	padding:48px 16px 0;
}
.l-ranking h3{
	font-size:15px;
	font-weight:700;
	margin-bottom:16px;
}
.l-ranking--list{
}
.l-ranking--listItem{
	padding:16px 0;
	margin-bottom:16px;
	border-bottom:solid 1px #E3E3E7;
}
.l-ranking--listFlex{
	margin-bottom:8px;
}
.l-ranking--listFlex a{
	display:flex;
	align-items:center;
	justify-content:flex-start;
	width:100%;
	gap:18px;
	color:#000;
	text-decoration:none;
}

.l-ranking--listFlex a img{
	width:162px;
	height:auto;
	border-radius:6px;
}

.l-ranking--listFlex a div h4{
	font-size:14px;
	font-weight:600;
	line-height:1.6;
}
.l-ranking--listTime{
	display:block;
	text-align:right;
	font-size:12px;
	color:#7D7F88;
}
