@charset "UTF-8";
/* ////////////////////////////
WEB MAGAZINE
//////////////////////////// */
img{
width: 100%;
}
.inner_1000 {
  max-width:1000px;
  width: 90%;
  margin: 0 auto;
}

#content_Wrap .inner_1000 {
background: #fff;
border-radius: 30px;
margin: 0 auto 12vw;
}

#content_Wrap .content_area {
font-family: YuGothic, 'Yu Gothic', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'メイリオ', Meiryo, sans-serif;
padding:  clamp(20px, 5.090909%, 50px);
}
#content_Wrap .main_img {
width: 100%;
overflow: hidden;
border-radius: 30px;
margin: 0 auto 2em;
}
#content_Wrap .main_img figure {
width: 100%;
}
#content_Wrap .main_img img {
}
#content_Wrap .information_area {
display: flex;
margin: 0 auto 2em;
gap: 0 2em;
}
#content_Wrap .information_area > div {
display: flex;
flex-direction: column;
gap: 1em 0;
width: fit-content;
}
#content_Wrap .information_area > .icon {
width: 20%;
max-width: 90px;
}
#content_Wrap .cat-affiliation {
display: flex;
align-items: center;
gap: 0 1em;
}
#content_Wrap .cat {
display: inline-block;
font-size: clamp(14px,1.67em,20px);
padding: 0.5em 0.8em;
color: #fff;
font-weight: 600;
}
.tag01 { background: #fc92e3; }
.tag02 { background: #a91d70; }
.tag03 { background: #f29600; }
.tag04 { background: #009fe8; }
.tag05 { background: #c8bb9b; }

#content_Wrap .affiliation {
font-size: clamp(14px,1.67em,20px);
}
#content_Wrap .main_title {
font-size: clamp(24px,2.7em,32px);
font-weight: 700;
}
#content_Wrap h2 {

}
#content_Wrap .date {
font-size: 13px;
}
#content_Wrap h5 {
}
#content_Wrap .main_content {
display: flex;
flex-direction: column;
gap: 2em 0;
}
#content_Wrap .main_text {
font-size: clamp(14px,1.67em,20px);
line-height: 1.75;
font-weight: 400;
}

#content_Wrap .more {
color: #036eb7;
font-size: clamp(14px,1.67em,20px);
font-weight: 400;
}

#content_Wrap .main_text figure {
}
#content_Wrap .main_text img {
}
#content_Wrap br {
}
#content_Wrap .content_img {
/* display: flex;
justify-content: flex-start;
width: 60%; */
/* overflow: hidden;
border-radius: 30px; */
}
#content_Wrap .content_img figure {

}
#content_Wrap .content_img figure img {
  width: auto;
  max-width: 100%;
  overflow: hidden;
  border-radius: 30px;
}
#content_Wrap .content_img figure figcaption {
  font-size: clamp(11px,1.31em,16px);
  margin-top: 1em;
}

#content_Wrap .inner_1000 {
height: 1000px; /* すでに指定されている */
overflow-y: auto; /* 縦スクロールを有効に */
width: 82%;
}
#content_Wrap .inner_1000::-webkit-scrollbar {
width: 10px;
}

#content_Wrap .inner_1000::-webkit-scrollbar-track {
background: #f0f0f0;
border-radius: 5px;
}

#content_Wrap .inner_1000::-webkit-scrollbar-thumb {
background-color: #888;
border-radius: 4px;
border: 2px solid #f0f0f0; /* スクロールバーの隙間を作る */
}

#content_Wrap .inner_1000::-webkit-scrollbar-thumb:hover {
background-color: #555;
}

.scrollable {
overflow-y: auto;
}
.scroll-container {
  position: relative;
  width: 100%;
  height: 96%;
  overflow: hidden; /* ネイティブのスクロール非表示 */
}

.scroll-content {
  height: 100%;
  width: 100%;
  overflow-y: scroll; /* JavaScriptで操作対象 */
  padding-right: 20px; /* 内容がつまみと重ならないように */
  box-sizing: content-box;
}

.custom-scrollbar {
  position: absolute;
  top: 4%;
  right: 5px; /* ← 好きな位置に配置可能 */
  width: 12px;
  height: 96%;
  background: #eee;
  border-radius: 10px;
}

.scroll-thumb {
  width: 100%;
  background: #888;
  border-radius: 9999px;
  height: 40px; /* JavaScriptで動的に変更 */
  cursor: pointer;
  position: absolute;
  top: 0;
}

/* basercms burger_editor */
.main_content [data-bgb] p {
  margin: 0;
}

/*=========================================================================================================
tab
=========================================================================================================*/
@media screen and (max-width: 1024px) {



}

/*=========================================================================================================
sp
=========================================================================================================*/
@media screen and (max-width: 767px) {


#content_Wrap .main_img {
border-radius: 20px;
margin: 0 auto 2em;
}
#content_Wrap .information_area {
gap: 0 1em;
}
#content_Wrap .cat-affiliation {
flex-direction: column;
align-items: flex-start;
gap: 10px 0;
}
#content_Wrap .cat {
width: fit-content;
font-size: 13px;
}
#content_Wrap .affiliation {
font-size: 11px;
}
#content_Wrap .main_title {
font-size: 19px;
line-height: 1.3;
}
#content_Wrap .main_text {
font-size: 15px;
}
#content_Wrap .more {
font-size: 15px;
}
#content_Wrap .content_img figure figcaption {
  font-size: 11px;
}
/* #content_Wrap .content_img {
width: 100%;
border-radius: 20px;
} */
#content_Wrap .content_img figure img {
  width: 100%;
  border-radius: 20px;
}

.custom-scrollbar {
  width: 8px;
}
}
