@charset "utf-8";

/* -------------------------------------------------------------------
innerの設定
------------------------------------------------------------------- */
.rhapsody-inner{
	width:min(90%,1336px);
	margin: 0 auto;
	padding:0em 0 0em;

}
.rhapsody-inner h2{
	text-align:center;
	margin:0px 0 0;
}

.rhapsody-main{
	width:min(100%,924px);
	margin: 0 auto;
	padding:0em 0 0em;

}
.rhapsody-detail{
	margin:15px 0;
	display:grid;
	grid-template-columns:1fr;
	gap:15px;
}
@media screen and (min-width:768px){
.rhapsody-detail{
	margin:30px 0;
	grid-template-columns:1fr 2fr;
	align-items:center;
	}
}

.rhapsody-detail .order1{
	order:2;
}
@media screen and (min-width:768px){
.rhapsody-detail .order1{
	order:1;
	}
}
.rhapsody-detail .order1 figure{
	text-align:center;
	max-width:40%;
	margin: 0 auto;
}
@media screen and (min-width:768px){
.rhapsody-detail .order1 figure{
	text-align:center;
	max-width:80%;
	}
}

.rhapsody-detail .order2{
	order:1;
}
.rhapsody-detail .order2 .title{
	color:#5c5a5a;
	font-size:clamp(14px,3.5vw,20px);
	margin:0px 0 15px;
	letter-spacing:2px;
}
.rhapsody-detail .order2 .name{
	padding:20px 0;
	border-top:1px solid #231815;
	border-bottom:1px solid #231815;

}
.rhapsody-detail .order2 dl{
	display:flex;
	gap:15px;
	letter-spacing:2px;
}

.rhapsody-detail .order2 dd{
	font-size:clamp(18px,4vw,25px);
}
.rhapsody-detail .order2 dd span{
	display:block;
	font-size:.8rem;

}
.rhapsody-detail .order2 .detail_text{
	font-size:clamp(14px,3.5vw,16px);
	margin:10px 0 0px;
	letter-spacing:2px;
}
.column-inner{
	margin:40px 0;

}
.column-inner ul{
	display:grid;
	grid-template-columns:repeat(1,1fr);
	gap:10px;
	text-align:center;
	letter-spacing:1px;
}


@media screen and (min-width:768px){
.column-inner ul{
	gap:10px 8px;
	grid-template-columns:repeat(3,1fr);
	}
}
.column-inner ul li span{
	display:block;
	font-size:.9rem;
	font-weight:500;
}

.column-inner ul li a{
	background:#8fc31f;
	color:#fff;
	display:block;
	padding:15px 5px;
	text-decoration:none;
	border-radius:10px;
	font-size:clamp(16px,3vw,17px);
	font-weight:500;
	letter-spacing:1px;
	position:relative;
}

@media screen and (max-width:768px){
.column-inner ul li a{
	padding:8px 5px;
	max-width:95%;
	margin: 0 auto;
	}
}

.arrow_r {
  position: relative;
  display: inline-block;
  padding-left: 20px;
}
.arrow_r:before {
  content: '';
  width: 6px;
  height: 6px;
  border: 0;
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
  transform: rotate(45deg);
  position: absolute;
  top: 0;
  right: 13px;
  bottom: 0;
  margin: auto;
}

.detail-column_list {
	width:min(100%,700px);
	margin: 30px auto;
}
.detail-column_list dt{
	border-left:6px solid #19582f;
	padding:3px 10px ;
	margin:0 0 15px;
	font-size:clamp(16px,3.5vw,18px);
	font-weight:700;
}
.detail-column_list dd{
	line-height:1.8;
	font-size:clamp(14px,3vw,15px);
	letter-spacing:1px;
  background-color: #fff; /* 背景色 */
  background-image: linear-gradient(90deg, transparent 0%, transparent 50%, #fff 50%, #fff 100%), /* 点線1の色 */
                    linear-gradient(180deg, #ccc 1px, transparent 1px); /* 点線2の色と太さ */
  background-size: 6px 100%, /* 点線1のサイズ */
                   100% 2.5em; /* 点線2のサイズ */
  line-height: 2.5em; /* 文字の高さ */
  padding-bottom: 1px; /* 最終行の下にも罫線を引く */


