@charset "UTF-8";

/* ----------------------------------
 COMMON
---------------------------------- */
.pc-only { display: block !important;}
.sp-only { display: none !important;}
#senkou2025 h1, #senkou2025 h2, #senkou2025 h3, #senkou2025 h4 {
  margin: 0;
  padding: 0;
  border: none;
  background-color: transparent;
}
#senkou2025 img { vertical-align: bottom;}

@media screen and (max-width: 768px) {
  .pc-only { display: none !important;}
  .sp-only { display: block !important;}
  #senkou2025 img { height: auto;}
}

/* ----------------------------------
 先行販売
---------------------------------- */
#senkou2025 { margin-bottom: 60px;}
#senkou2025 .contents_inner { width: 100%; max-width: 1000px; margin: auto;}
#senkou2025 .mv_area { margin: 0 auto 50px;}
#senkou2025 .detail_area { font-weight: 500; color: #333; text-align: center;}
#senkou2025 .h2_heading { padding: 8px 30px; margin: 0 auto 25px; font-size: 27px; font-weight: 600; line-height: 1; display: table; background: #E8DCBC;}
#senkou2025 .normal_txt { font-size: 18px; line-height: 1.7;}
#senkou2025 .normal_txt span { font-size: 20px; font-weight: 900; display: block;}
#senkou2025 .note_txt { margin-top: 5px; font-size: 15px; color: #AA0046;}
#senkou2025 .period_heading { margin: 40px 0 10px; font-size: 20px; font-weight: 600;}
#senkou2025 .period_txt { margin: auto; border-bottom: #AA0046 3px solid; font-size: 26px; font-weight: 600; letter-spacing: 6px; display: table;}

@media screen and (max-width: 768px) {
	#senkou2025 { margin-bottom: 40px;}
  #senkou2025 .mv_area { margin: 0 auto 25px;}
  #senkou2025 .h2_heading { padding: 6px 15px; margin: 0 auto 20px; font-size: 20px;}
  #senkou2025 .normal_txt { font-size: 16px; line-height: 1.7;}
  #senkou2025 .normal_txt span { margin-bottom: 10px; font-size: 18px; line-height: 1.5;}
  #senkou2025 .note_txt { font-size: 12px;}
  #senkou2025 .period_heading { margin: 20px 0 3px; font-size: 15px;}
  #senkou2025 .period_txt { margin: auto; border-bottom: none; font-size: 20px; letter-spacing: 2px;}
  #senkou2025 .period_txt span { margin: auto; border-bottom: #AA0046 3px solid; display: table;}
  #senkou2025 .period_txt span:first-of-type { margin-bottom: 5px;}
}

/* ----------------------------------
 羽毛カバー
---------------------------------- */
#umou-cover { width: 100%; padding: 0 15px; margin-bottom: 30px; counter-reset: number 0;}
#umou-cover * { font-family: 'Noto Sans JP', sans-serif;}
#umou-cover .btn-area { padding: 0 10px; margin-top: 20px; text-align: center;}
#umou-cover .btn-area .more {
  width: 60%;
  padding: 8px;
  border-radius: 27px;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  color: #fff;
  display: inline-block;
  background-color: #B8A361;
  position: relative;
}
#umou-cover .btn-area .more::after {
  content: '';
  width: 16px;
  height: 10px;
  display: block;
  background-image: url(/img/usr/event/umo-ks/icon_arrow_under.png);
  background-size: 16px 10px;
  position: absolute;
  top: 50%;
  right: 14px;
  transform: translateY(-50%);
}
#umou-cover .mv { width: 100vw; margin: 0 calc(50% - 50vw);}
#umou-cover .step { margin-top: 40px;}
#umou-cover .step .lead { font-size: 16px; text-align: center;}
#umou-cover .step .lead span { display: block; position: relative;}
#umou-cover .step .lead span:before,
#umou-cover .step .lead span:after  { content: ''; width: 1px; height: 63px; border-left: #B8A361 2px dashed; display: block; position: absolute; top: 50%;}
#umou-cover .step .lead span:before { left: 15px; transform: translateY(-30%) rotate(-40deg);}
#umou-cover .step .lead span:after  { right: 15px; transform: translateY(-30%) rotate(40deg);}
#umou-cover .step h2.step-title {
  padding: 8px 0 12px;
  border-bottom: 1px solid rgba(184, 163, 97, 0.7);
  font-size: 13px !important;
	font-weight: 700;
  color: #46362F !important;
  position: relative;
}
#umou-cover .step-title::before {
  content: counter(number) " ";
  width: 30px;
  height: 30px;
  margin-right: 5px;
  font-size: 15px;
  text-align: center;
  text-shadow: none;
  line-height: 30px;
  color: #fff;
  display: inline-block;
  background-color: #B8A361;
  border-radius: 50%;
  counter-increment: number 1;
}
#umou-cover .flow-lists { padding: 0 15px; display: flex; flex-wrap: wrap;}
#umou-cover .step1 .flow-item { width: 100%; position: relative;}
#umou-cover .step1 .flow-item:not(:first-child) { margin-top: 50px;}
#umou-cover .step2 .flow-item { width: calc(100% / 2 - 15px); margin-top: 15px; margin-left: 15px; position: relative;}
#umou-cover .step1 { margin-top: 25px;}
#umou-cover .step2,
#umou-cover .step3 { margin-top: 30PX;}
#umou-cover .step2 .flow-lists { margin-top: -15px; margin-left: -15px;}
#umou-cover .step2 .flow-item:first-child  { order: 1;}
#umou-cover .step2 .flow-item:nth-child(2) { order: 2;}
#umou-cover .step2 .flow-item:nth-child(3) { order: 4;}
#umou-cover .step2 .flow-item:nth-child(4) { order: 3;}
#umou-cover .step1 .flow-item:not(:last-child)::after {
  content: '';
  width: 30px;
  height: 28px;
  display: block;
  background-image: url(/img/usr/event/umo-ks/icon_flow_arrow.png);
  background-size: 30px 28px;
  position: absolute;
}
#umou-cover .step1 .flow-item:first-child::after { bottom: -33px; left: 50%; transform: translateX(-50%) rotate(90deg);}
#umou-cover .step2 .flow-item:not(:last-child)::after {
  content: '';
  width: 10px;
  height: 8px;
  display: block;
  background-image: url(/img/usr/event/umo-ks/icon_flow_arrow.png);
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
}
#umou-cover .step2 .flow-item:first-child::after  { top: 50%; right: -12px; transform: translateY(-50%);}
#umou-cover .step2 .flow-item:nth-child(2)::after { bottom: -12px; left: 50%; transform: translateX(-50%) rotate(90deg);}
#umou-cover .step2 .flow-item:nth-child(3)::after { top: 50%; left: -12px; transform: translateY(-50%) rotate(180deg);}
#umou-cover .point { margin-top: 50px;}
#umou-cover .point-title { padding: 10px; border: none; font-size: 17px !important; text-align: center; color: #fff !important; background-color: #B8A361;}
#umou-cover .point-content .title::before,
#umou-cover .point-content .title::after { content: ''; width: calc(116 / 343 * 100%); height: 1px; display: block; background-color: #B8A361; position: absolute; top: 50%;}
#umou-cover .point-detail > .title::before,
#umou-cover .point-detail > .title::after { max-width: 40px;}
#umou-cover .point-content .title::before { left: 0;}
#umou-cover .point-content .title::after { right: 0;}
#umou-cover .point-content + .point-content { margin-top: 52px;}
#umou-cover .point-content .lists { display: flex; flex-direction: column;}
#umou-cover .point-content .point-detail:nth-of-type(2) .lists { margin-top: -12px; flex-direction: row;}
#umou-cover .point-content .lists .item { width: 100%;}
#umou-cover .point-content:first-child .lists .item:not(:first-child) { margin-top: 28px;}
#umou-cover .point-content .text { margin: 15px 0; font-size: 14px; font-weight: 400; line-height: 1.8em;}
#umou-cover .point-content .point-detail:nth-of-type(2) .lists { margin-top: 15px;}
#umou-cover .point-content .point-detail:nth-of-type(2) .item { width: calc(100% / 2 - 5px); margin-left: 5px;}
#umou-cover .point-content .point-detail:nth-of-type(2) .text { text-align: left;}
#umou-cover .point-content .point-detail + .point-detail { margin-top: 35px;}
#umou-cover .point-content .title { padding: 0 40px; font-size: 20px !important; font-weight: bold; text-align: center; position: relative; background: none;}
#umou-cover .step3 .flow-item p { margin: 0 0 15px; font-size: 14px; font-weight: 400; line-height: 1.8em;}

@media screen and (min-width: 769px) {
	#umou-cover { max-width: 1000px; margin: 0 auto 80px;}
  #umou-cover .sp_only { display: none;}
  #umou-cover .btn-area { margin-top: 40px;}
  #umou-cover .btn-area .more { padding: 8px 20px; max-width: 200px;}
  #umou-cover .btn-area .more:hover { opacity: 0.8; transition: 0.3s opacity ease;}
  #umou-cover .mv { width: 100%; margin: 0;}
  #umou-cover .step { margin-top: 65px;}
  #umou-cover .step .lead { font-size: 26px;}
  #umou-cover .step .lead span { display: inline-block;}
  #umou-cover .step .lead span:before, #umou-cover .step .lead span:after { height: 63px; top: 50%;}
  #umou-cover .step .lead span:before { left: -20px; transform: translateY(-30%) rotate(-40deg);}
  #umou-cover .step .lead span:after { right: -10px; transform: translateY(-30%) rotate(40deg);}
  #umou-cover .step-content.step1 { margin-top: 50px;}
  #umou-cover .step h2.step-title { padding: 20px 0; font-size: 24px !important; border-bottom: 3px solid rgba(184, 163, 97, 0.7);}
  #umou-cover .step-title::before { content: counter(number) " "; width: 68px; height: 68px; margin-right: 5PX; font-size: 30px; line-height: 68px; counter-increment: number 1;}
  #umou-cover .detail { margin-top: 34px;}
  #umou-cover .flow-lists { padding: 0 40px; margin: -40px 0 0 -40px; flex-direction: row;}
  #umou-cover .step1 .flow-item,
	#umou-cover .step2 .flow-item,
	#umou-cover .step3 .flow-item { width: calc(100% / 2 - 40px); margin-top: 40px; margin-left: 40px; position: relative;}
  #umou-cover .step3 .flow-item:nth-child(2) { margin-top: 80px; font-weight: normal;}
  #umou-cover .point { margin-top: 100px;}
  #umou-cover .point-title { margin-bottom: 16px; font-size: 20px !important;}
  #umou-cover .step1 .flow-item:first-child::after { bottom: unset; top: 50%; left: unset; right: -33px; transform: translateY(-50%);}
  #umou-cover .step2 .flow-item:not(:last-child)::after { content: ''; width: 30px; height: 28px;}
  #umou-cover .step2 .flow-item:first-child::after  { right: -35px;}
  #umou-cover .step2 .flow-item:nth-child(2)::after { bottom: -34px;}
  #umou-cover .step2 .flow-item:nth-child(3)::after { left: -35px;}
  #umou-cover .point-content + .point-content { margin-top: 52px;}
  #umou-cover .point-content + .point-title { margin-top: 36px;}
  #umou-cover .point-content .point-detail { margin-top: 37px;}
  #umou-cover .point-content .point-detail + .point-detail { margin-top: 48px;}
  #umou-cover .point-content .lists { flex-direction: row; margin-left: -40px;}
  #umou-cover .point-content .lists .item { width: calc(100% / 2 - 40px); margin-top: 0; margin-left: 40px;}
  #umou-cover .point-content { margin-top: 36px;}
  #umou-cover .step2 .flow-lists { margin-left: -40px;}
  #umou-cover .card { height: 100%; display: flex; flex-direction: column;}
  #umou-cover .card .img { margin-top: auto;}
  #umou-cover .point-content .title { padding: 0 40px; font-size: 25px; font-weight: bold; text-align: center; position: relative;}
  #umou-cover .point-content .title::before, #umou-cover .point-content .title::after { width: calc(151 / 460 * 100%);}
  #umou-cover .point-title + .lists { margin-top: 36px;}
  #umou-cover .point-detail > .title::before, #umou-cover .point-detail > .title::after { max-width: 230px;}
  #umou-cover .point-detail .lists { margin-top: 18px;}
  #umou-cover .point-detail:nth-of-type(2) .lists { margin-top: 40px;}
  #umou-cover .point-content .point-detail:nth-of-type(1) .text { text-align: center;}
  #umou-cover .point-content .point-detail:nth-of-type(2) .lists { margin-left: -40px; margin-top: -10px;}
  #umou-cover .point-content .point-detail:nth-of-type(2) .item { margin-top: 35px; margin-left: 40px;}
  #umou-cover .point-content:first-child .lists .item:not(:first-child) { margin-top: 0;}
}

/* ----------------------------------
 2025.10 add
---------------------------------- */
#umou-cover .details { margin: 40px 0;}
#umou-cover .details .detail-box + .detail-box { margin-top: 20px;}
#umou-cover .details .detail-box dt {
  padding: 12px 0;
  border-top: #B8A361 1px solid;
  border-bottom: #B8A361 1px solid;
  font-size: 17px;
  font-weight: 700;
	text-align: center;
  color: #333;
  position: relative;
	cursor: pointer;
}
#umou-cover .details .detail-box dt::after {
  content: '';
  width: 10px;
  height: 10px;
  border-right: #333 1px solid;
  border-top: #333 1px solid;
  position: absolute;
  right: 20px;
  top: calc(50% - 7px);
  display: block;
  transform: rotate(135deg);
	transition: 0.3s;
}
#umou-cover .details .detail-box dt.active::after { top: calc(50% - 3px); transform: rotate(-45deg);}
#umou-cover .details .detail-box dd { padding: 20px; display: none;}
#umou-cover .details .detail-box dd .text { margin: 0 0 20px; font-size: 13px; text-align: left; line-height: 2.0; color: #333;}
#umou-cover .details .detail-box dd .lead { margin: 0 0 20px; font-size: 17px; text-align: center; line-height: 1.4; color: #B8A361;}
#umou-cover .details .detail-box dd .color-point-list { display: flex; justify-content: center; align-items: center; column-gap: 10px;}
#umou-cover .details .detail-box dd .color-point-list li {
	width: 90px;
	height: 90px;
	border-radius: 90px;
	font-size: 13px;
	font-weight: 700;
	text-align: center;
	line-height: 1.4;
	color: #FFF;
  display: flex;
  justify-content: center;
  align-items: center;
	background-color: #EA9C83;
}
#umou-cover .details .detail-box dd .color-point-list li:nth-child(2) { background-color: #EB8484;}
#umou-cover .details .detail-box dd .color-point-list li:nth-child(3) { background-color: #C75E60;}
#umou-cover .details .detail-box dd .image { width: 100%; max-width: 550px; margin: 0 auto; text-align: center;}
#umou-cover .details .detail-box dd .image img { max-width: calc(100% + 70px); margin: 0 0 0 -35px;}
#umou-cover .details .detail-box dd .check-list li {
	padding: 7px 7px 7px 50px;
	font-size: 15px;
	font-weight: 400;
	color: #333;
	background-color: rgba(226,219,192,0.25);
	position: relative;
}
#umou-cover .details .detail-box dd .check-list li + li { margin-top: 10px;}
#umou-cover .details .detail-box dd .check-list li::before {
  content: '';
  width: 15px;
  height: 15px;
  border: #333 1px solid;
	background: #FFF;
	display: block;
	position: absolute;
	top: calc(50% - 7.5px);
	left: 20px;
}
#umou-cover .details .detail-box dd .check-list li::after {
  content: '';
  width: 17px;
  height: 8px;
  border-right: #D01719 3px solid;
  border-top: #D01719 3px solid;
  display: block;
  position: absolute;
  top: calc(50% - 8px);
  left: 20px;
  transform: rotate(130deg);
}
#umou-cover .point .point-content.two-type .title { margin-bottom: 20px;}
#umou-cover .point .point-content.two-type .title::before,
#umou-cover .point .point-content.two-type .title::after { max-width: 18% !important; display: block !important;}
#umou-cover .point .point-content.two-type .lists .item + .item { margin-top: 50px;}
#umou-cover .point .point-content h3.star { margin: 0 0 10px; font-size: 18px; font-weight: 700; text-align: center; color: #444; background: none;}
#umou-cover .point .point-content h3.star .gold { margin: 0; color: #B8A361; text-align: center; display: block;}
#umou-cover .point .point-content .card-detail .name { margin: 0 0 15px; font-size: 16px; font-weight: 700; text-align: center; color: #444;}
#umou-cover .point .point-content .point-detail .item .pop { font-size: 15px; font-weight: 700; text-align: center; color: #444;}
#umou-cover .point .point-content .point-detail .item .name { font-size: 14px; font-weight: 700; text-align: center; color: #444;}
#umou-cover .point .point-content .point-detail .item .img-list { padding: 0 5px; margin-top: 15px; display: flex; justify-content: space-between;}
#umou-cover .point .point-content .point-detail .item:nth-child(1) .img-list { padding: 0 5px 0 0;}
#umou-cover .point .point-content .point-detail .item:nth-child(2) .img-list { padding: 0 0 0 5px;}
#umou-cover .point .point-content .point-detail .item .img-list .img-box { width: calc(50% - 2.5px); text-align: center;}
#umou-cover .point .point-content .point-detail .item .img-list .img-box figure { margin: 0 0 10px; text-align: center;}
#umou-cover .point .point-content .point-detail .item .img-list .img-box figure img { width: 100%; vertical-align: top;}
#umou-cover .point .point-content .point-detail .item .img-list .img-box .color { font-size: 14px; font-weight: 700; text-align: center; color: #444;}

@media screen and (min-width: 769px) {
	#umou-cover .details { margin: 80px 0;}
	#umou-cover .details .detail-box + .detail-box { margin-top: 20px;}
	#umou-cover .details .detail-box dt { padding: 10px 0; font-size: 20px;}
	#umou-cover .details .detail-box dt::after { right: 240px;}
	#umou-cover .details .detail-box dd { padding: 20px; display: none;}
	#umou-cover .details .detail-box dd .text { text-align: center;}
	#umou-cover .details .detail-box dd .lead { font-size: 20px;}
	#umou-cover .details .detail-box dd .color-point-list { column-gap: 22px;}
	#umou-cover .details .detail-box dd .color-point-list li { width: 95px; height: 95px; border-radius: 95px;}
	#umou-cover .details .detail-box dd .image img { max-width: 100%; margin: 0;}
	#umou-cover .details .detail-box dd .check-list li { padding: 5px 50px; font-size: 20px;}
	#umou-cover .details .detail-box dd .check-list li + li { margin-top: 22px;}
	#umou-cover .point .point-content.two-type .title { margin-bottom: 20px;}
	#umou-cover .point .point-content.two-type .title::before,
	#umou-cover .point .point-content.two-type .title::after { max-width: 250px !important;}
	#umou-cover .point .point-content.two-type .lists .item + .item { margin-top: 0;}
	#umou-cover .point .point-content h3.star { font-size: 20px;}
	#umou-cover .point .point-content h3.star .gold { margin: 0 0 0 20px; display: inline-block;}
	#umou-cover .point .point-content .card-detail .name { margin: 0 0 20px; font-size: 20px;}
	#umou-cover .point .point-content .point-detail .item .pop { font-size: 20px;}
	#umou-cover .point .point-content .point-detail .item .name { font-size: 20px;}
	#umou-cover .point .point-content .point-detail .item .img-list { padding: 0 !important; margin-top: 20px;}
	#umou-cover .point .point-content .point-detail .item .img-list .img-box { width: calc(50% - 10px);}
	#umou-cover .point .point-content .point-detail .item .img-list .img-box .color { font-size: 20px;}
}