@charset "UTF-8";

body {
  font-family: "A1 Gothic R";
}

/* index：プロフィールモーダルPCのみ幅調整 */
@media (min-width: 641px) {
.content_wrap{border-radius:20px;} 
article{padding-bottom:20px;}
#yodogawa .inner{width:60%;} 
#yodogawa{margin:0 auto;}
}
.is_pc #yodogawa a:hover, .is_sp #yodogawa a.touch { border-bottom: none; }

/* index：プロフィールモーダル調整 */
.is_pc .profile_inner{position:relative;padding-bottom:500px;}
.is_sp .profile_inner{position:relative;padding-bottom:48vh;}
.is_sp #modal_wrap {padding-bottom: 10vh;}
div.profile_inner .pic{position:absolute; bottom:0;margin: 0 20px 40px 0;}


/* index：顧問＆助っ人アイコン、もくじ調整  */
#information_free ul .bd_b {margin-bottom:50px; padding-top:20px; }
.info-cont{display: flex; justify-content: center; padding-bottom:3em;}
.info-icon{padding: 1em; flex-basis: 22%;}
.info-icon p{font-size: 0.7em; text-align:left;line-height:1.5em;}

/* 共通 */
#index_nav {border-block: 1px solid #93754c;padding-block: 8%;}
#index_nav .bd_b {border-top: none;border-bottom: none;}
#index_nav .bd_t {border:none;}
#index_nav {padding: 40px 0;}
.padB64{padding-bottom: 64px;}
.padT64{padding-top: 64px;}


/* pc */
@media (min-width: 641px) {
#index_nav a {padding: 20px 0;}
#index_nav .title {margin: 0 0 16px 0;}
.info-cont{display: flex; justify-content: center; padding-bottom:3em; width:90%; margin:0 auto;}
.info-icon{padding:0.3em; flex-basis: 26%;}
.series-title {padding-inline: 10%;margin-bottom: 4%;box-sizing: border-box;}
.ss_ttl{width:80%; margin: 0 auto;}
.text_tlist{margin-top:-40px;}
.modal_content_inner{line-height:2em;padding: 50px 20px;}
.st_ttl{font-size:120%; font-weight:bold; color:#00A05A;padding:2em 0 2em 5em;}
#talk_body .letter .txt_box, #talk_body .memo .txt_box, #talk_body .balloon .txt_box, #talk_body .repo_bg .txt_box{margin: 0px auto;}
#talk_body .letter .txt_box .desc, #talk_body .memo .txt_box .desc, #talk_body .balloon .txt_box .desc ,#talk_body .repo_bg .txt_box .desc {max-width: calc(100% - 34px);}
#talk_body .memo .txt_box{padding: 20px 10px;}
#talk_body .padT0 .txt_box{padding: 0 40px 40px 40px;}
.icon_txt{padding: 56px 0 40px;}
.books_yoko{margin:-40px auto;}
.books_tate{width:75%;margin:-40px auto;}
.letter {
  background: #fff;
  box-shadow: 0 0 10px rgba(0,0,0,0.2);
  margin: -30px auto 30px;
  padding: 4px 0;
  max-width: 700px;
  min-height: 300px;
  position: relative;
  width: 80%;
  background-image: linear-gradient(180deg, #efefef 1px, transparent 1px); /* 罫線の色と太さ */
  background-size: 90% 1.8em; /* 行の高さ */
  padding-bottom: 1px;
}
.memo {
  max-width: 500px;
  margin: 0 auto;
  padding: 1em 1.5em;
  box-shadow: 0 4px 4px rgb(0 0 0 / 5%), 0 2px 3px -2px rgb(0 0 0 / 1%);
  background-image: linear-gradient(transparent calc(100% - 1px), #e6edf3 50%, #e6edf3), linear-gradient(90deg, transparent calc(100% - 1px), #e6edf3 50%, #e6edf3);
  background-size: 15px 15px;
  background-repeat: repeat;
  background-color: #ffffff;
  color: #333333;
}
.balloon{
  position: relative;
  background-color: #fff;
  border-radius: 30px;
  width: 75%;
  margin:0 auto 64px;
  border: 4px solid #E0F8FF;
}
.balloon::before{
  content: '';
  position: absolute;
  display: block;
  border-radius: 50%;
  background-color: #fff;
  left: -25px;
  top: 25px;
  width: 30px;
  height: 30px;
  border: 4px solid #E0F8FF;
}
.balloon::after{
  content: '';
  position: absolute;
  display: block;
  border-radius: 50%;
  background-color: #fff;
  left: -43px;
  top: 10px;
  width: 15px;
  height: 15px;
  border: 4px solid #E0F8FF;
}
.fukidashi {max-width: 260px;}
.repo_bg{
  background-color: #FFFDE8;
  border-radius: 20px;
  width: 88%;
  margin:0 auto 64px;
  border: 4px solid #fff;
}
}


/* sp */
@media (max-width: 640px) {
#index_nav a {padding: 10px 0;}
#index_nav .title {padding: 0 10%;margin: 0 0 4px 0;}
#information_free ul .bd_b {margin-bottom:4em; padding:1em 0; }
#talk_body .txt_box{padding: 0;}
#talk_body .balloon .txt_box{margin: calc(20 / 640 * 100vw) auto calc(20 / 640 * 100vw) auto;}
.info-icon{padding:0.2em; flex-basis: 33.3%;}
.series-title {padding-inline: 5%;margin-bottom: 4%;box-sizing: border-box;}
#index_nav .title {padding: 0 5%;}
.ss_ttl{margin-bottom: -20px;}
.text_tlist{margin-top:-16px;}
.modal_content_inner{line-height:2em;}
.btn_modal_content{padding-bottom:2em;}
.st_ttl{font-size:120%; font-weight:bold; color:#00A05A;padding:1em 0 2em 0;}
.books_yoko{margin:0 auto;}
.books_tate{width:75%;margin:0 auto;}

.icon_txt{padding: 32px 0 16px;}
.letter {
  background: #fff;
  box-shadow: 0 0 10px rgba(0,0,0,0.2);
  margin: 0 auto 30px;
  padding: 4px 16px;
  max-width: 700px;
  min-height: 300px;
  position: relative;
  width: 90%;
  background-image: linear-gradient(180deg, #efefef 1px, transparent 1px); /* 罫線の色と太さ */
  background-size: 90% 1.8em; /* 行の高さ */
  padding-bottom: 1px;
}
.memo {
  width: 90%;
  margin: 0 auto;
  padding: 1em 1.5em;
  box-shadow: 0 4px 4px rgb(0 0 0 / 5%), 0 2px 3px -2px rgb(0 0 0 / 1%);
  background-image: linear-gradient(transparent calc(100% - 1px), #e6edf3 50%, #e6edf3), linear-gradient(90deg, transparent calc(100% - 1px), #e6edf3 50%, #e6edf3);
  background-size: 15px 15px;
  background-repeat: repeat;
  background-color: #ffffff;
  color: #333333;
}
.balloon{
  position: relative;
  padding: 16px;
  background-color: #fff;
  border-radius: 20px;
  width: 90%;
  margin:0 auto 64px;
  border: 4px solid #E0F8FF;
}
.balloon::before{
  content: '';
  position: absolute;
  display: block;
  border-radius: 50%;
  background-color: #fff;
  left: 20px;
  top: -20px;
  width: 30px;
  height: 30px;
  border: 4px solid #E0F8FF;
}
.balloon::after{
  content: '';
  position: absolute;
  display: block;
  border-radius: 50%;
  background-color: #fff;
  left: 2px;
  top: -36px;
  width: 15px;
  height: 15px;
  border: 4px solid #E0F8FF;
}
.fukidashi {max-width: 100%;}
}


/* 階層下：写真レッスン 20251025 */
.zassou_gallery {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  width: 100%;
  gap: 4px;
}
.zassou_gallery a {
  cursor: pointer;
}
.is_pc #talk_body .zassou_gallery a:hover,
.is_sp #talk_body .zassou_gallery a.touch {
  border-bottom: none;
}
.zassou_gallery img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  aspect-ratio: 1 / 1;
}


/* 階層下：プランターレポート20250516 */
.kokoronokoe{padding:10px;border-radius: 10px; background: #E0F8FF;color:#999;font-weight:bold;text-align: center;font-size:110%;}
.kokoronokoe {animation: floating-y 1.8s ease-in-out infinite alternate-reverse;}
@keyframes floating-x {0% {transform: translateX(-5%);} 100% {transform: translateX(5%);} }
@keyframes floating-y {0% {transform: translateY(-10%);} 100% {transform: translateY(10%);} }
.fukidashi {
    display: flex;
    justify-content: center;
    position: relative;
    margin-top: 15px;
    padding: .8em 1.2em;
    border-radius: 5px;
    background-color: #E2F2F5;
}
.fukidashi::before {
    position: absolute;
    top: -15px;
    left: 7%;
    width: 20px;
    height: 15px;
    background-color: #E2F2F5;
    clip-path: polygon(50% 0, 0 100%, 100% 100%);
    content: '';
}



/* 階層下：雑草部だより20250424 */
.letter:before, .letter:after {
  content: "";
  height: 98%;
  position: absolute;
  width: 100%;
  z-index: -1;
}
.letter:before {
  background: #fafafa;
  box-shadow: 0 0 8px rgba(0,0,0,0.2);
  left: -5px;
  top: 4px;
  transform: rotate(-2.5deg);
}
.letter:after {
  background: #f6f6f6;
  box-shadow: 0 0 3px rgba(0,0,0,0.2);
  right: -3px;
  top: 1px;
  transform: rotate(1.4deg);
}


/* 階層下：屋上に雑草プランターを置いてみよう */
.about_seo .txt_box{width:90%;margin:0 auto; border-radius:20px;}
.about_seo img{max-width:50%;margin:0 auto;}

#talk_body dd, .info_taidan_txt dd {margin: 0 0 3.5em 0;}
#talk_body dt {position: relative;}


#talk_body dt[data-name="メロン"] {
  color: transparent !important;
}
#talk_body dt[data-name="メロン"]::after {
  content: "";
  background-image: url(https://www.1101.com/seisakuchu/images/icon/s/yoko.yamada.png);
  display: block;
  width: 60px;
  height: 60px;
  background-size: contain;
  position: absolute;
  top: 0;
  right: 20px;
}
#talk_body dt[data-name="かご"] {
  color: transparent !important;
}
#talk_body dt[data-name="かご"]::after {
  content: "";
  background-image: url(https://www.1101.com/seisakuchu/images/icon/s/tomoko.kagoshima.png);
  display: block;
  width: 60px;
  height: 60px;
  background-size: contain;
  position: absolute;
  top: 0;
  right: 20px;
}
#talk_body dt[data-name="もも"] {
  color: transparent !important;
}
#talk_body dt[data-name="もも"]::after {
  content: "";
  background-image: url(https://www.1101.com/seisakuchu/images/icon/s/momoko.fujimori.png);
  display: block;
  width: 60px;
  height: 60px;
  background-size: contain;
  position: absolute;
  top: 0;
  right: 20px;
}
#talk_body dt[data-name="なっつ"] {
  color: transparent !important;
}
#talk_body dt[data-name="なっつ"]::after {
  content: "";
  background-image: url(https://www.1101.com/seisakuchu/images/icon/s/natsuki.yasuki.png);
  display: block;
  width: 60px;
  height: 60px;
  background-size: contain;
  position: absolute;
  top: 0;
  right: 20px;
}
#talk_body dt[data-name="安木"] {
  color: transparent !important;
}
#talk_body dt[data-name="安木"]::after {
  content: "";
  background-image: url(https://www.1101.com/seisakuchu/images/icon/s/natsuki.yasuki.png);
  display: block;
  width: 60px;
  height: 60px;
  background-size: contain;
  position: absolute;
  top: 0;
  right: 20px;
}
#talk_body dt[data-name="せお"] {
  color: transparent !important;
}
#talk_body dt[data-name="せお"]::after {
  content: "";
  background-image: url(https://www.1101.com/n/s/wp-content/uploads/2024/12/seosan.png);
  display: block;
  width: 60px;
  height: 60px;
  background-size: contain;
  position: absolute;
  top: 0;
  right: 20px;
}
#talk_body dt[data-name="イトイ"] {
  color: transparent !important;
}
#talk_body dt[data-name="イトイ"]::after {
  content: "";
  background-image: url(https://www.1101.com/seisakuchu/images/icon/s/darling.png);
  display: block;
  width: 60px;
  height: 60px;
  background-size: contain;
  position: absolute;
  top: 0;
  right: 20px;
}
#talk_body dt[data-name="稲垣"] {
  color: transparent !important;
}
#talk_body dt[data-name="稲垣"]::after {
  content: "";
  background-image: url(https://www.1101.com/ns_zassoubu/img/icon_jsuzuki.png);
  display: block;
  width: 60px;
  height: 60px;
  background-size: contain;
  position: absolute;
  top: 0;
  right: 20px;
}
#talk_body dt[data-name="鈴木"] {
  color: transparent !important;
}
#talk_body dt[data-name="鈴木"]::after {
  content: "";
  background-image: url(https://www.1101.com/ns_zassoubu/img/icon_jsuzuki.png);
  display: block;
  width: 60px;
  height: 60px;
  background-size: contain;
  position: absolute;
  top: 0;
  right: 20px;
}
#talk_body dt[data-name="なっつ・もも"] {
  color: transparent !important;
}
#talk_body dt[data-name="なっつ・もも"]::after {
  content: "";
  background-image: url(https://www.1101.com/ns_zassoubu/img/icon_natumero.png);
  display: block;
  width: 80px;
  height: 60px;
  background-size: contain;
  position: absolute;
  top: 0;
  right: 20px;
}
#talk_body dt[data-name="なっつ・メロン"] {
  color: transparent !important;
}
#talk_body dt[data-name="なっつ・メロン"]::after {
  content: "";
  background-image: url(https://www.1101.com/ns_zassoubu/img/icon_natumero.png);
  display: block;
  width: 80px;
  height: 60px;
  background-size: contain;
  position: absolute;
  top: 0;
  right: 20px;
}
#talk_body dt[data-name="なっつ・かご"] {
  color: transparent !important;
}
#talk_body dt[data-name="なっつ・かご"]::after {
  content: "";
  background-image: url(https://www.1101.com/ns_zassoubu/img/icon_natukago.png);
  display: block;
  width: 80px;
  height: 60px;
  background-size: contain;
  position: absolute;
  top: 0;
  right: 20px;
}
#talk_body dt[data-name="もも・かご・なっつ"] {
  color: transparent !important;
}
#talk_body dt[data-name="もも・かご・なっつ"]::after {
  content: "";
  background-image: url(https://www.1101.com/ns_zassoubu/img/icon_mokana.png);
  display: block;
  width: 120px;
  height: 60px;
  background-size: contain;
  position: absolute;
  top: 0;
  right: 20px;
}
#talk_body dt[data-name="メロ・かご・なっつ"] {
  color: transparent !important;
}
#talk_body dt[data-name="メロ・かご・なっつ"]::after {
  content: "";
  background-image: url(https://www.1101.com/ns_zassoubu/img/icon_mekana.png);
  display: block;
  width: 120px;
  height: 60px;
  background-size: contain;
  position: absolute;
  top: 0;
  right: 20px;
}


@media (max-width: 640px) {
  #talk_body dt[data-name="メロン"], #talk_body dt[data-name="かご"], #talk_body dt[data-name="もも"], #talk_body dt[data-name="なっつ"], #talk_body dt[data-name="安木"], #talk_body dt[data-name="せお"], #talk_body dt[data-name="イトイ"], #talk_body dt[data-name="稲垣"], #talk_body dt[data-name="鈴木"], #talk_body dt[data-name="なっつ・もも"], #talk_body dt[data-name="なっつ・メロン"], #talk_body dt[data-name="なっつ・かご"], #talk_body dt[data-name="もも・かご・なっつ"], #talk_body dt[data-name="メロ・かご・なっつ"] {
    height: 60px;
  }
  #talk_body dt[data-name="メロン"]::after, #talk_body dt[data-name="かご"]::after,#talk_body dt[data-name="もも"]::after, #talk_body dt[data-name="なっつ"]::after, #talk_body dt[data-name="安木"]::after, #talk_body dt[data-name="せお"]::after, #talk_body dt[data-name="イトイ"]::after, #talk_body dt[data-name="稲垣"]::after, #talk_body dt[data-name="鈴木"]::after, #talk_body dt[data-name="なっつ・もも"]::after, #talk_body dt[data-name="なっつ・メロン"]::after, #talk_body dt[data-name="なっつ・かご"]::after, #talk_body dt[data-name="もも・かご・なっつ"]::after, #talk_body dt[data-name="メロ・かご・なっつ"]::after {
    right: unset;
    left: -4px;
  }
}